jQueryを使ってhtml divを追加する

Question

これは私のhtml構造体です。 jQueryを使ってdivを作成したいと思います。

<div class="main"> 
    <div class="main-1"> 
    </div> 
    <div class="main-2"> 
    </div> 
    <div class="main-3"> 
    </div> 
</div> 

私の予想出力はそれはのようになりますclass="main-1" and class="main-2"

で別のdivが含まれます： - ここに

<div class="main"> 
    <div class="newadd"> 
     <div class="main-1"> 
     </div> 
     <div class="main-2"> 
     </div> 
    </div> 
    <div class="main-3"> 
    </div> 
</div> 

は、newaddは追加する必要が新しいクラスです。私は既存のdivの間に、余分なdiv要素を追加する方法がわからない、

jQuery(".main"); 

しかし - ：私が使用して、メインのdivを選択することができます。

Answer 1

ユーザーwrapall

$('.main-1, .main-2,').wrapAll('<div class="newadd" />'); 

出力

<div class="main"> 
    <div class="newadd"> 
     <div class="main-1"> 
     </div> 
    <div class="newadd"> 
     <div class="main-2"> 
     </div> 
    </div> 
    <div class="main-3"> 
    </div> 
</div> 

Answer 2

使用.wrapAll()：

$('.main .wrapMe').wrapAll("<div class='newadd' />")

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="main"> 
 
    <div class="main-1 wrapMe">a 
 
    </div> 
 
    <div class="main-2 wrapMe">b 
 
    </div> 
 
    <div class="main-3">c 
 
    </div> 
 
</div>