Question

Don’t ask why but I need to add class zebra to the <li> elements with the content next to them. This is as far as I’ve got, but I’m not sure what calculation to use:

$("li").each(function(index){
    if(index % ??? == 0) {  // <-- not sure what to put here

    }
});

<ul>
  <li></li>
  <li></li>
  <li></li> <!-- add the zebra class here -->
  <li></li>
  <li></li>
  <li></li>
  <li></li> <!-- add the zebra class here -->
  <li></li>
  <li></li>
  <li></li>
  <li></li> <!-- add the zebra class here -->
  <li></li>
</ul>

Can anyone help?

Answer 1

The :nth-child() selector can accept an equation, and it solves your problem perfectly:

$('ul li:nth-child(4n+3)').addClass("zebra").text("Here");

Selects every 4th li starting at 3 onwards, :nth-child(4n-1) would also work (every 4th-1 element). No each() or modulo necessary.

http://jsfiddle.net/AvPhe/ – Example based on your sample input, the zebra class is added along with the text “Here”.