Javascript array in combo boxes
<p>I have been given an array in the following format and need to put it into two drop down boxes one with make and the other with model based on the first selection. (the actual array is huge, but I have just included the first few)</p>

<pre><code>var aMember = [{
    "Make": "other",
    "Models": ["other"]
}, {
    "Make": "Boat",
    "Models": ["Over 21 ft.", "Under 21 ft."]
}, {
    "Make": "Motorcycle",
    "Models": ["Over 600cc", "Under 600cc"]
}];
</code></pre>

<p>I need to have a make combo box with Other, Boat and Motorcycle, which when selected populates the second combo box with the options.</p>

<p>I have done almost no JavaScript before, but have tried the following, which does not work.
I really don't know if I am anywhere near to what I need.</p>

<pre><code>&lt;html&gt;
&lt;head&gt;
&lt;script&gt;
var cars =[{"Make":"other","Models":["other"]},{"Make":"Boat","Models":["Over 21 ft.","Under 21 ft."]},{"Make":"Motorcycle","Models":["Over 600cc","Under 600cc"]}];

function populateDropdown(drop, items) {
   drop.empty();
   for(var i = 0; i &lt; items.length; i++) {
      drop.append('&lt;option value=' + i + '&gt;' + items[i].Make + '&lt;/option&gt;');
   }
   drop.show();
}

populateDropdown( $('#Makes'), cars );


$('#Models').change(function() {
   var modelIndex = $(this).val();
   var model = Models[modelIndex ];

   populateDropdown( $('#Models'), cars.Models);

});

&lt;/script&gt;
&lt;/head&gt;
&lt;body onload = "populateDropdown( $('#Makes'), cars );"&gt;
&lt;form&gt;


MAKE:
&lt;select name = 'Makes'&gt;
&lt;/select&gt;
MODEL:
&lt;select name = 'Models'&gt;
&lt;/select&gt;

&lt;/select&gt;
&lt;/form&gt;
&lt;/body&gt;
&lt;/html&gt;  
</code></pre>

<p>Thanks</p>
