Sort a table by drop down values (simplify my code)

Question

I have a table. I want the user to be able to be able to filter the table by the option they pick in a given drop down. I have it working, but it\'s messy and hard to add new ro

Answer 1

You can change your html markup like this

  

    
cats
  
  

    
cats
  
  

    
dogs
  
  

    
birds
  
  

    
dogs
  


  Select...
  Cats
  Dogs
  Birds

Then your jQuery

$('#selectFilter').change(function(){
    var trs = $('#animal tr'); 
    if(this.value == ''){  // if first option picked show all
         trs.show(); 
    }else{
       var $el = $('.'+this.value);  // element to show
       trs.not($el).hide(); // hide all but the elements to show
       $el.show();       // show elements
    }
});

FIDDLE