Comment sélectionner chaque deuxième élément avec jquery nextUntil?

Question

Je suis en train de sélectionner chaque deuxième élément après avoir utilisé la méthode .nextUntil() de jQuery. Comment puis-je sélectionner chaque deuxième élément après l'élément de sélecteur?

J'ai déjà essayé d'utiliser .nextUntil(".headerRow", "tr:odd") ainsi que .nextUntil(".headerRow", "tr:nth-child(odd)")

Voici ma ligne de code que je veux faire fonctionner :

$('.headerRow').nextUntil(".headerRow", "tr:nth-child(odd)").css("background-color", "rgb(240,240,240)");

Cela sélectionne chaque deuxième tr... cependant cela sélectionne les lignes basées sur toute la table au lieu de la dernière .headerRow

Cela ressemble à ceci :

 - (non sélectionné)
 - (non sélectionné)
 - (non sélectionné)
 - (non sélectionné)
 - (sélectionné)
 - (non sélectionné)
 - (non sélectionné)
 - (non sélectionné) <----- devrait être sélectionné
 - (sélectionné) <------ ne devrait pas être sélectionné
 - (non sélectionné) <----- devrait être sélectionné
 - (non sélectionné)
 - (sélectionné)
 - (non sélectionné)
...

Il devrait commencer à sélectionner les comme ceci :

 - (non sélectionné, ok)
 - (non sélectionné, ok)
 - (non sélectionné, ok)
 - (non sélectionné)
 - (sélectionné)
 - (non sélectionné)
 - (non sélectionné)
 - (sélectionné)
 - (non sélectionné)
 - (sélectionné)
 - (non sélectionné)
 - (sélectionné)
 - (non sélectionné)
...

Comment puis-je corriger cela?

EDIT: La table est générée de cette manière:

    ${item.materialNumber}
            ${item.materialDescription}
            ${item.quantity}
            ${item.unit}

class="headerRow">

Answer 1

Malheureusement, cela n'est pas réalisable en utilisant simplement :impair, :pair car les impairs et les pairs sont des références à leur ordre absolu.

Par conséquent, vous devez d'abord regrouper - avant d'appliquer les impairs et les pairs - ce qui deviendra alors relatif pour ce groupe.
Voici un exemple en utilisant .each():

$('.headerRow').each(function() {
   $(this).nextUntil('.headerRow', 'tr:pair').css('background', 'red');
});

no
no
no
---HR no---
sel
no
---HR no---
sel
no
sel
no
sel
---HR no---
---HR no---
---HR no---
---HR no---
sel
no

$(this).nextUntil('.headerRow'), est notre groupe itérable.