Custom selectors

[b]Custom Selectors[/b]
To the wide variety of CSS and XPath selectors, jQuery adds its own custom selectors.
Most of the custom selectors allow us to pick certain elements out of a line-up, so to
speak. The syntax is the same as the CSS pseudo-class syntax, where the selector starts
with a colon (:). For example, if we wanted to select the second item from a matched
set of divs with a class of horizontal, we would write it like this:

 $('div.horizontal:eq(1)')

Note that the eq(1) gets the second item from the set because JavaScript array
numbering is zero-based, meaning that it starts with 0. In contrast, CSS is one-based,
so a CSS selector such as $('div:nth-child(1)') gets any div that is the first child
of its parent.
[b]Styling Alternate Rows[/b]
Two very useful custom selectors in the jQuery library are :odd and :even.

.odd {
  background-color: #ffc; /* pale yellow for odd rows */
}
.even {
  background-color: #cef; /* pale blue for even rows */
}

$(document).ready(function() {
  $('tr:odd').addClass('odd');
  $('tr:even').addClass('even');
});