Как выбрать только 4-й и более высокий LI в каждом UL?

Question

Для этого XHTML:

<ul class="collapse">
<li>One</li>
<li>Two</li>
<li>Three</li>
<li>Four</li>
<li>Five</li>
</ul>

<ul class="collapse">
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
</ul>

Используя jQuery, как выбрать только 4-й и более высокий LI в каждом UL?

Я пробовал:

$("ul.collapse li:gt(2)").css("color", "red");

Но он выбирает 4-й и более высокий LI во всем документе. «Четыре», «Пять» и «1», «2», «3», «4» - красные.

Answer 1

Вы можете сделать это так:

$("ul.collapse").find("li:gt(2)").css("color", "red");

Вы можете поиграть / проверить его здесь . Это находит каждый <ul class="collapse">, затем для каждого независимо оценивает селектор поиска, давая вам результат, который вы ищете.

Answer 2

N-дитя тоже добьется цели.

$(document).ready(function(){
    $('.collapse li:nth-child(n+4)').css("color", "red");
});