JSFiddle - React, Tailwind, and code Playground

by chandu bandu

HTML

<body onload="writeProblem()">
<h2>Practicing Your Pluses!</h2>

<form name="problem">
<input type="text" size="1" name="carry1"><br/> 
<label id="top"></label><br />
<label id="bottom"></label><br /><hr width="60px" align="left"/>
<input type="text" size="3" name="answer">
</form><br/>

<input type="button" onClick="submitAnswer()" value="Submit Answers"/>

</body>

JavaScript

var mathProblem = new Array();
var carryOver = document.getElementById("carry");
var correct = 0;
var wrong = 2;
// writing the problem 10 times
function writeProblem(){
    for (var i=1; i<11; i++){
        num1 = (Math.floor(Math.random()*50)+1);
        num2 = (Math.floor(Math.random()*50)+1);
        document.getElementById("top").innerHTML = num1;
        document.getElementById("bottom").innerHTML = "+" + num2;
        mathProblem[i] = num1 + num2;
        document.forms["problem"]["answer"].value = "";
}
}
function submitAnswer(){
    var i=0;

    for (i=1;i<11;i++) {
        if (document.forms["problem"]["answer"].value == mathProblem[i]) {
        writeProblem();
        return true;

    }
    else if(isNaN (document.forms["problem"]["answer"].value)){
            alert("This is not a spelling test please use numbers");
            return false;
    }

}
}