У меня есть следующий html
<div id="test">
<p class="one"></p> <---first one----->
<p class="two"></p>
<p class="three"></p>
<p class="four"></p>
<p class="one"></p> <---second one---->
<p class="two"></p>
<p class="three"></p>
<p class="four"></p>
<p class="one"></p> <--- third one----->
<p class="two"></p>
<p class="three"></p>
<p class="four"></p>
</div>
Итак, теперь я нахожусь сначала в .one class
тогда я бы хотел выбрать следующий .one class
и снова, если я нахожусь во втором, тогда я бы выбрал следующий .one class
. Я думаю, что нет :next-child
что :next-child
то вроде этого .one:next-child
так как я могу это сделать?
Обновить
Ответ @chopper в порядке! но если он не может найти следующий, то он должен выбрать первый one
Используйте селектор jQuery .next()
:
var secondOne = firstOne.next('.one');
EDIT: @KevinB прав, правильный ответ
var secondOne = firstOne.nextAll('.one:first');
или
var secondOne = firstOne.nextAll('.one').first();
Я не уверен, что вы пытаетесь. если вы хотите следующий .one
вы можете просто использовать селектор для сестер.
p.one ~ p.one ~ p.one{
background-color: green;
}
Например, если вы хотите второй .one
тогда выполните следующие действия:
p.one ~ p.one {
/* apply styles */ /* selects all sibling elements */
}
p.one ~ p.one ~ p.one{ /* overriding css styles */
/* apply default styles */ /* selects all other sibling elements leaving the second element */
}
Рабочая скрипка (при наведении)
.one