Добавить html div с помощью jQuery

Question

Это моя структура html. Я хочу создать div, используя jQuery.

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

Мой ожидается выход будет содержать другой DIV с class="main-1" and class="main-2"

Он должен выглядеть следующим образом: -

<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 с помощью: -

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>