jQuery nth with DIV

jQuery nth with DIV

本文关键字：DIV with nth jQuery      更新时间：2023-09-26

在Business Catalyst中，我有一个输出无序列表的div。我需要在每4个项目之后列出一个单独的非无序项目。硬编码版本如下所示:

<div class="article-list">
 <ul class="article-list grid">
   <li>Item 1</li>
   <li>Item 2</li>
   <li>Item 3</li>
   <li>Item 4</li>
 </ul>


<div class="sponsored-post">
 <ul class="sponsored-post grid">
   <li>Hardcoded Item 1</li>
   <li>Hardcoded Item 2</li>
 </ul>
</div>
<div class="article-list">
 <ul class="article-list grid">
   <li>Item 5</li>
   <li>Item 6</li>
   <li>Item 7</li>
   <li>Item 8</li>
 </ul>
</div>

使用jQuery .each()并跟踪循环中的变量。如果该计数器能被4整除，则在<li>

后面添加一个div。
$(".article-list").each(function(i, value) {
    if(i % 4 == 0) {
        newDiv = $("<div></div>").html("new div");
        $(this).append(newDiv);
    }
});
相关文章：