Javascript onchange event not working in my code
<p>what is wrong with this code? Why is my onchange event not working? I have tried a lot already and it's making me nuts. Please help?</p>

<pre><code>&lt;!DOCTYPE html&gt;
&lt;html&gt;
&lt;head&gt;
&lt;script type=text/javascript&gt;
function populate(s1,s2){
var s1 = document.getElementById(s1);
var s2 = document.getElementById(s2);
s2.innerHTML = "";
if(s1.value == "Chevy"){
var optionArray ["|", "camaro|Camaro", "corvette|Corvette",
"impala|Impala"];
}
else if(s1.value=="Dodge"){
var optionArray=["|", "avanger|Avanger", "challenger|Challenger",
"charger|Charger"];
}
else if(s1.value=="Ford"){
var optionArray=["|", "mustang|Mustang", "shelby|Shelby"];
}
for(var option in optionArray){
var pair=optionArray[option].split("|");
var newOption=document.createElement("option");
newOption.value=pair[0]; 
newOption.innerHtml=pair[1];
s2.options.add(newOption);
}
}
&lt;/script&gt;
&lt;/head&gt;
&lt;body&gt;
&lt;h2&gt;Choose Your Car&lt;/h2&gt;
&lt;hr /&gt;
Choose Car Make:
&lt;select id="slct1" name="slct1" onchange="populate(this.id, 'slct2')"&gt;
&lt;option value=""&gt;Select&lt;/option&gt;
&lt;option value="Chevy"&gt;Chevy&lt;/option&gt;
&lt;option value="Dodge"&gt;Dodge&lt;/option&gt;
&lt;option value="Ford"&gt;Ford&lt;/option&gt;
&lt;/select&gt;
&lt;hr /&gt;
Choose Car Model:
&lt;select id="slct2" name="slct2"&gt;&lt;/select&gt;
&lt;hr /&gt;
&lt;/body&gt;
&lt;/html&gt;
</code></pre>

<p>Anyone, please point out to me where is the exact problem...Let me try running it accordingly </p>