The problem

Construct a web application that implements an arithmetic quiz.

The web application will ask the user five arithmetic questions. When the page opens the application will display the first arithmetic problem and wait for the user to type their answer and click the Check button. When the user clicks the Check button the application will check to see whether or not the answer is correct, update the text below the check button that shows how many problems the user has answered correctly and then show the next problem.

What to do

Start by setting up a data structure that stores the arithmetic problems. The simplest way to do this is to represent each problem as an object that has question and answer properties. The list of problems then just becomes an array of these problem objects.

You will need to write an event handler function to respond to the click event on the Check button. That function will check whether or not the user's answer is correct, update the score, display the new score, and then move on the next problem.

I suggest that you display the questions in a label element that acts as a label for text input. To set the text content of the label element, use JavaScript to set its innerText property to the problem text.