Полоса класс для div

Question

У меня длинный список из нескольких div ... скажем, 20 div

Вся упаковка в другой ..

<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>

Я хотел бы добавить класс "серый" в один из двух div и сделать его зеброй! JQuery, пожалуйста!

Answer 1

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

Имейте в виду, что 'grey' не является семантическим именем класса.Лучше назвать идентификатор «странным», «зеброй» или чем-то еще.Если бы вы решили и изменили нечетный цвет на синий, ваше имя класса было бы очень странным: P

Answer 2

jQuery делает его настолько простым, насколько это возможно:

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

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

Answer 3

Если вам не нужны старые версии IE, вы можете сделать это, используя только CSS:

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

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