最初のX DIVを選択する方法

Question

8列のDIV（画像を含む）私の問題は、X（この数字はスライダに設定されている）DIVの後に新しい行を取得できるようにしたいということです。これらの8 DIVの場合は、たとえば、後に新しい行を追加したいと思います。 4 DIV's。

のような私のDIVのルック：

<div id="table-cell-x" class="table-cells"><img src="...."></div> 

のx = 1 - > 8

は私が望む結果は（8つのdiv要素とXが4に設定されている場合には）次のとおりです。

<div class="table-rows"> 
    <div id="table-cell-1" class="table-cells">div1</div> 
    <div id="table-cell-2" class="table-cells">div2</div> 
    <div id="table-cell-3" class="table-cells">div3</div> 
    <div id="table-cell-4" class="table-cells">div4</div> 
</div> 

<div class="table-rows"> 
    <div id="table-cell-5" class="table-cells">div5</div> 
    <div id="table-cell-6" class="table-cells">div6</div> 
    <div id="table-cell-7" class="table-cells">div7</div> 
    <div id="table-cell-8" class="table-cells">div8</div> 
</div> 

私はそれを試してみました：

$('div.table-cells':lt(4)).append('<div class="table-row"></div>'); 
$('div.table-cells':gt(4)).append('<div class="table-row"></div>'); 

しかし、それはあなたが私はあなたがそれぞれ4 div.table-cellsが内部ラップしますたいことを理解するようになっ何

よろしく、 ジョン

Answer 1

....この問題で私を助けてくださいすることができます........動作しませんでしたコンテナtable-row div。はい、その後、以下のように行うと

は： -

$(document).ready(function(){ 
 
    var $child_div = $("div.table-cells"); 
 
    for (var i = 0; i < $child_div.length; i += 4) { 
 
     var $parent_div = $("<div/>", { 
 
      class: 'table-row' 
 
     }); 
 
     $child_div.slice(i, i +4).wrapAll($parent_div); 
 
    } 
 
});

.table-row{ 
 
background:grey; 
 
margin-bottom:20px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="table-cell-1" class="table-cells">div1</div> 
 
<div id="table-cell-2" class="table-cells">div2</div> 
 
<div id="table-cell-3" class="table-cells">div3</div> 
 
<div id="table-cell-4" class="table-cells">div4</div> 
 
<div id="table-cell-5" class="table-cells">div5</div> 
 
<div id="table-cell-6" class="table-cells">div6</div> 
 
<div id="table-cell-7" class="table-cells">div7</div> 
 
<div id="table-cell-8" class="table-cells">div8</div>

参考： - 私はそれを理解したよう

.wrapAll() | jQuery API Documentation