ajax - Jquery clear select in the second populate -

i have jquery , working fine. problem facing when select second time add data previous results. , not clear it. tried use empty function , .html('') did not work.

$(document).ready(function(){  $("#cat").change(function(){ $.ajax( {url:"maintenance_task.php", data:   { cat_id : $("#cat option:selected").val() }, datatype: 'json', success:function(json){      $.each(json, function(i, value) {          $('#task_type').append($('<option>').text(value).attr('value', i));     });   }});  });}); 

can me this. in advance.

try this

$(document).ready(function(){    $("#cat").change(function(){    $.ajax({       url:"maintenance_task.php",       data:   { cat_id : $("#cat option:selected").val() },       datatype: 'json',       success:function(json){         $('#task_type').html(' ');         $.each(json, function(i, value) {           $('#task_type').append($('<option>').text(value).attr('value', i));         });      }   });   }); });