While loop and innerHTML
<p>I'm not sure if there is something wrong with my while loop or the innerHTML section of my code but I'm not able to show the drop down lists in the div tags when the submit button is clicked. Can anyone see whats wrong with it.</p>

<pre><code>&lt;html&gt;
&lt;head&gt;
&lt;script type="text/javascript"&gt;

function getvalue() {
 number = document.getnumber.input.value;
 document.getElementById("result").value = number; 
} 
&lt;/script&gt;

&lt;/head&gt;
&lt;body&gt;

&lt;script&gt;
function generatedropdown() {
html = '&lt;select name="select" id="i"&gt;';
while (i &lt; number)  {            
html+='&lt;option&gt;Test 1&lt;/option&gt;';
html+='&lt;option&gt;Test 2&lt;/option&gt;';
html+='&lt;option&gt;Test 3&lt;/option&gt;';
html+='&lt;option&gt;Test 4&lt;/option&gt;';
html+='&lt;option&gt;Test 5&lt;/option&gt;';        
i++;
}
html+='&lt;/select&gt;';
document.getElementById("my-output").innerHTML = html;
}
&lt;/script&gt;


&lt;form name="getnumber"&gt;
Input number: &lt;input type="text" name="input"&gt;
&lt;input type="button" value="Next" onClick="getvalue()"&gt;
&lt;/form&gt;


&lt;form id="showlists"&gt;
Number entered: &lt;input type="text" id="result" readonly="readonly"&gt;     
&lt;input type="button" value="Show lists" onClick="generatedropdown()"&gt;
&lt;div id="my-output"&gt;Generated List:&lt;/div&gt;
&lt;/form&gt;
&lt;/body&gt;
&lt;/html&gt;
</code></pre>
