Stripe class for div

Question

I have a long list of multiple div... let's say 20 div

All wrap in another one..

<div id="main">
 <div class="xyz"> text text </div>
 <div class="xyz"> text text </div>
 <div class="xyz"> text text </div>
 <div class="xyz"> text text </div>
 <div class="xyz"> text text </div>
.... etc
</div>

i like to add class "grey" in one out of two div and make it zebra ! jquery please !

Answer 1

$('.xyz:odd').addClass('grey');

Do mind that 'grey' is not a semantic classname. Better call id 'odd' or 'zebra' or something. If you'd make up your mind and change the odd color to blue your classname would be real strange :P

Answer 2

jQuery makes it just about as easy as it can be:

$('#main>div.xyz:even').addClass('grey');

http://api.jquery.com/even-selector/

Answer 3

If you don't care about older versions of IE, you can do this using CSS alone:

.xyz:nth-child(odd) {
  background-color: ...;
}

.xyz:nth-child(even) {
  background-color: ...;
}