jQuery .each() avec plusieurs sélecteurs - saut, puis .empty() éléments

Question

J'aimerais supprimer tous les éléments correspondant, mais sauter la première instance de chaque match:

// Works as expected: removes all but first instance of .a 
jQuery ('.a', '#scope') 
    .each (function (i) { 
     if (i > 0) jQuery (this).empty(); 
    }); 

// Expected: removal of all but first instance of .a and .b 
// Result: removal of *all* instances .a and .b 
jQuery ('.a, .b', '#scope') 
    .each (function (i) { 
     if (i > 1) jQuery (this).empty(); 
    }); 

<div id="scope"> 

    <!-- Want to keep the first instance of .a and .b --> 

    <div class="a">[bla]</div> 
    <div class="b">[bla]</div> 

    <!-- Want to remove all the others --> 

    <div class="a">[bla]</div> 
    <div class="b">[bla]</div> 

    <div class="a">[bla]</div> 
    <div class="b">[bla]</div> 
    ... 
</div> 

Toutes les suggestions?

• En utilisant jQuery() plutôt que $() en raison du conflit avec le code 'héritage'
• En utilisant .empty() parce .a contient JS Je voudrais désactiver
• Coincé avec jQuery 1.2.3

Merci toi!

Answer 1

pour cette solution:

$('.a:gt(0), .b:gt(0)').remove(); 

Je ne sais pas si les combiner dans un sélecteur est possible avec le :gt(), il peut modifier la portée et de supprimer tous après la première .a.

Answer 2

Votre HTML semble incorrect. Je l'ai modifié à ce qui suit:

<div id="scope"> 

    <!-- Want to keep the first instance of .a and .b --> 

    <div class="a">[bla]</div> 
    <div class="b">[bla]</div> 

    <!-- Want to remove all the others --> 

    <div class="a">[bla]</div> 
    <div class="b">[bla]</div> 

    <div class="a">[bla]</div> 
    <div class="b">[bla]</div> 
    ... 
</div> 

Alors cela semble fonctionner:

jQuery('div#scope div.a').not(':first').empty(); 
jQuery('div#scope div.b').not(':first').empty();