JavaScript/HTML/CSS - Multiple forms on one page
<p>I'm trying to create a simple web page in JavaScript, HTML, and CSS. The web page generates 5 div elements. Each div element includes a random number, text input, and submit button. My code below does that.</p>

<p>The user then should be able to enter the random number into the text input box and click the submit button. The script should check if they entered the correct answer or not.</p>

<p>I'm not sure if this is possible? I understand how to write the code for just a single form on the page but this example is using 5 forms on a single page that are dynamically generated. Any help would greatly be appreciated.</p>

<pre><code>    &lt;html&gt;
    &lt;head&gt;

    &lt;style type="text/css"&gt;
       #test {
           width:250px;
            padding:10px;
            border:5px solid gray;
            margin:10px;

        }
     &lt;/style&gt;

    &lt;/head&gt;

    &lt;body&gt;
    &lt;script&gt;

    for (i = 0; i &lt; 5; i++) {

        document.write('&lt;div id="test"&gt;');
        var ranNum = Math.floor(Math.random()*10);
        document.write(ranNum);
        document.write("&lt;p&gt;Enter the number above:&lt;/p&gt;");
        document.write("&lt;form id=\"form1\" name=\"form1\" method=\"post\" action=\"\"&gt;&lt;input type=\"text\" name=\"answer\" id=\"answer\" /&gt;&lt;input type=\"submit\" name=\"button\" id=\"button\" value=\"Submit\" /&gt;&lt;/form&gt;");
        document.write('&lt;/div&gt;');
    }

    &lt;/script&gt;
    &lt;/body&gt;
    &lt;/html&gt;
</code></pre>
