JQuery的：第n个孩子（）追加

Question

我有简单的列表：

<ul> 
<li>some text 1 </li> 
<li>some text 2</li> 
<li>some text 3</li> 
<li>some text 4</li> 
<li>some text 5</li> 
<li>some text 6</li> 
<li>some text 7</li> 
</ul> 

我需要每个4N元素后添加一些DIV

我：

$("ul li:nth-child(4n)").after("<div style='color:black'>test</div>"); 

但是比如我有4个元素和我的div之后，并且比我只有3个元素，但我需要在第三个元素后追加我的div ...如何做到这一点？ 谢谢！

Answer 1

你可以使用.add()添加到jQuery的结果集的最后li，如果它不被nth-child规则匹配..

$("ul li:nth-child(4n)") 
    .add('ul li:last') 
    .after("<div style='color:black'>test</div>"); 

演示在http://jsfiddle.net/gaby/a8vAU/

Answer 2

你还可以依靠grep来做采摘：

var $lis = $('li'); 

$lis = $($.grep($lis, function (l, i) {return (i+1)%4 == 0 || i == $lis.length - 1;})); 

$lis.after("<div style='color:black'>test</div>");