В списке оберните каждую группу изображений и следующий div ... (jQuery)

Question

Я не могу достичь своей цели, несмотря на все, что я прочитал. Извините, если вопрос уже задан. Я хочу, чтобы обернуть каждую группу изображений и следующий DIV, как показано в примере:

<div class="group"> 

    <img class="slide" src="..."> 
    <div class="content">...</div> 

    <img class="slide" src="..."> 
    <div class="content">...</div> 

    <img class="slide" src="..."> 
    <div class="content">...</div> 

    ... 

</div> 

в

<div class="group"> 

    <div class="subgroup"> 
     <img class="slide" src="..."> 
     <div class="content">...</div> 
    </div> 

    <div class="subgroup"> 
     <img class="slide" src="..."> 
     <div class="content">...</div> 
    </div> 

    <div class="subgroup"> 
     <img class="slide" src="..."> 
     <div class="content">...</div> 
    </div> 

    ... 

</div> 

Спасибо от заранее ...

Answer 1

попробовать этот

$(".group .slide").each(function(){ 
    $(this).next(".content").andSelf().wrapAll("<div class='subgroup' />"); 
}); 

Working Demo

Answer 2

Вы можете получить весь элемент слайда и содержимого. затем нарезать возвращен массив образуют множество элементов, а затем обернуть его в той же группе:

var childelements = $(".group > .slide , .group > .content"); 
for(var i = 0; i < childelements.length; i+=2) { 
    childelements.slice(i, i+2).wrapAll('<div class="subgroup"></div>'); 
} 

Working Demo