CODEWITHSUNDEEP
jquery
Udo
Udo

Reputation: 1157

select elements that doesnt contain a class in multiple class instance

Am trying to remove all rows in a table that dont contain a particular class, but each row contains at least 2 classes

     <tbody id='orderlist'>
     <tr class='big selected'><td></td></tr>
     <tr class='big'><td></td></tr>
     </tbody>

     $('#orderlist').not('.selected').fadeOut('slow',function(){
     $(this).remove();
     });

I want to be able to remove any row that doesnt contain the class selected first by fading it out of view.

Upvotes: 0

Views: 44

Answers (4)

Jai
Jai

Reputation: 74738

use .children(): http://jsfiddle.net/UpHcu/

$('#orderlist').children().not('.selected').fadeOut('slow', function () {
    this.remove();
});

Upvotes: 0

Adil
Adil

Reputation: 148110

You can use filter() and apply conditions to filter out the required set of elements.

$('#orderlist tr').filter(function(){
    if(!$(this).hasClass('selected') && this.className.split(' ').length == 2)
        return $(this);
}).fadeOut('slow').remove();

Upvotes: 0

ajp15243
ajp15243

Reputation: 7952

Your chained selector for .not('.selected') is trying to act upon the elements selected by $('#orderlist') (which will be the tbody itself), not on the children (the rows). Try something like this (add tr to your orderlist selector to get the child rows of your tbody):

$('#orderlist tr').not('.selected').fadeOut('slow',function(){
    $(this).remove();
});

Fiddle: http://jsfiddle.net/WcWex/

Upvotes: 2

phnkha
phnkha

Reputation: 7872

Try this:

$('#orderlist .big').not('.selected').fadeOut('slow',function(){
    $(this).remove();
});

Upvotes: 0

Related Questions