One dropdown select another dropdown value Change

<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<script language="javascript" type="text/javascript"> 
$(document).ready(function(){

var chocolates = [
{display: "Dark chocolate", value: "dark-chocolate" },
{display: "Milk chocolate", value: "milk-chocolate" },
{display: "White chocolate", value: "white-chocolate" },
{display: "Gianduja chocolate", value: "gianduja-chocolate" }];

var vegetables = [
{display: "Broccoli", value: "broccoli" },
{display: "Cabbage", value: "cabbage" },
{display: "Carrot", value: "carrot" },
{display: "Cauliflower", value: "cauliflower" }];

var icecreams = [
{display: "Frozen yogurt", value: "frozen-yogurt" },
{display: "Booza", value: "booza" },
{display: "Frozen yogurt", value: "frozen-yogurt" },
{display: "Ice milk", value: "ice-milk" }];

$("#indiavisatype").change(function() {
var parent = $(this).val();

switch(parent){
  case 'chocolates':
list(chocolates);
break;
  case 'vegetables':
list(vegetables);
break;
  case 'icecreams':
list(icecreams);
break;
default:
$("#indiavisatime").html('');
break;
   }
});


function list(array_list)
{
$("#indiavisatime").html("");
$(array_list).each(function (i) {
$("#indiavisatime").append("<option value=\""+array_list[i].value+"\">"+array_list[i].display+"</option>");
});
}

});
</script>


<div class="wrapper">
Category : <select name="parent_selection" id="indiavisatype">
    <option value="">-- Please Select --</option>
    <option value="chocolates">Chocolates</option>
    <option value="vegetables">Vegetables</option>
    <option value="icecreams">Ice cream</option>
</select>
<select name="child_selection" id="indiavisatime">
</select>
</div>