title: Jquery: Remove previous data in a select list
body: <p>i had the following question. </p>
  
  <p>i want to update my subcategory select list when the user select a specific leadcategory and show in other select list the subcategories. </p>
  
  <p>The problem is that i can't figure out when i'm selecting a another leadcategory my previous subcategory has to remove and fill with the new data depending wich leadcategory i selected. </p>
  
  <p>For now i've the following code. </p>
  
  <p>The data i parse is a json encode who looks like: </p>
  
  <pre><code> Website.Config = {"categorieen":{"1":{"1":"Navullingen ","2":"Potloden"},"2":{"3":"Navullingen","6":"potloden","7":"testSubcategorie"}}}
  
  
      function onChangeSubcategorie(){
  
   categorieen = Website.Config.categorieen;
  
   $("form#overviewFilter select#cat").change(function() {
    var hoofdCategorie = $(this).val();
    var subcategorieen = categorieen[hoofdCategorie];
  
    for(var c in subcategorieen ) {
     var tekst = subcategorieen[c];
  
     if(hoofdCategorie == 1) {
      $('form#overviewFilter select#scat').append("&lt;option value="+tekst+"&gt;"+tekst+"&lt;/option&gt;");
     }else if(hoofdCategorie == 2) {
  
      $('form#overviewFilter select#scat').append("&lt;option value="+tekst+"&gt;"+tekst+"&lt;/option&gt;");
     }
    }
   });
  }
  </code></pre>
  
  <p>thank you for helping. </p>