将类应用于每个第3个列表项

Question

我有以下脚本。目前它选择了我的列表中的第3项，并没有给它留出余地。问题是它只执行一次，有没有办法让它发生在列表中的每个第3项？我尝试使用.each，但我无法让它成功运作。

<script>
$(document).ready(function() {
    $("#contentlist li:eq(2)").css({marginRight: '0'});
});
</script>

Answer 1

使用nth-child的{​​{1}}伪类可以做到这一点。

3n

演示：http://jsfiddle.net/ThinkingStiff/gjvpR/

HTML：

$( '#contentlist li:nth-child(3n)' ).css({marginRight: '0'});

脚本：

<ul id="contentlist">
    <li>1</li>
    <li>2</li>
    <li>3</li>
    <li>1</li>
    <li>2</li>
    <li>3</li>
</ul>

输出：

Answer 2

使用nth-child CSS选择器：

$("#contentlist li:nth-child(3n)").css({marginRight: '0'});

演示（使用颜色而不是边距）：http://jsfiddle.net/ambiguous/DRCLF/