javascript - jQuery：最初と2番目の子のみをラップし、残りの子はラップしません

Question

私の実際のコードでは：

<div id="mother">
  <div id="child-01"></div>
  <div id="child-02"></div>
  <div id="child-03"></div>
  </ul>

私は生産する必要があります：

<div id="mother">
  <div id="myWrap">
    <div id="child-01"></div>
    <div id="child-02"></div>
  </div>
  <div id="child-03"></div>
  </ul>

私はラップで遊んでいました、。wrapAll()と子供たち、しかし私は立ち往生しています。

私の実際のコードにある場合：

<div id="mother">
  <div id="child-01"></div>
  <div id="child-02"></div>
  <div id="child-03"></div>
  </ul>

  <div id="uncle">
    <div id="cousin-01"></div>
    <div id="cousin-02"></div>
    <div id="cousin-03"></div>
    </ul>

どうすれば作成できますか：

<div id="mother">
  <div id="myWrap">
    <div id="child-01"></div>
    <div id="child-02"></div>
    <div id="cousin-02"></div>
  </div>
  <div id="child-03"></div>
  </ul>

Answer 1

まず、Adamが言ったように#、id属性からプレフィックスを削除します。また、終了タグと一致します。現在、あるべき </ul>場所があります。</div>

:lt()次に、次を使用して次の.wrapAll()ように実行できます。

$("#mother div:lt(2)").wrapAll("<div id='myWrap'></div>");

これにより、インデックス2（0と1が最初の2）未満のすべてが取得され、ラップされます。 ここでテストできます。

Answer 2

HTML IDから＃を削除します。

$("#mother div:eq(0), #mother div:eq(1)").wrapAll("<div id='father'></div>")

Answer 3

シャープはIDの一部であってはなりません。次に、次のことができます。

$('#child-01, #child-02').wrapAll('<div id="#mywrap" />');

Answer 4

$(document).ready(function(){
  $(".new-grid__item:nth-child(1), .new-grid__item:nth-child(2)").wrapAll('<div class="child"></div>');
});