Как обернуть определёные элементы с одинаковыми классами в div при использовании wrapall?

Question

[Дима Паутов]

У меня есть вот такой список элементов:

<div class="item"><a href=""><img src="" class="group1"></a></div>
<div class="item"><a href=""><img src="" class="group1"></a></div>
<div class="item"><a href=""><img src="" class="group2"></a></div>
<div class="item"><a href=""><img src="" class="group2"></a></div>
<div class="item"><a href=""><img src="" class="group3"></a></div>
<div class="item"><a href=""><img src="" class="group3"></a></div>
<div class="item"><a href=""><img src="" class="group3"></a></div>

нужно их обернуть в div элементы группы. Т.е. должно получиться так:

<div class="group">
<div class="item"><a href=""><img src="" class="group1"></a></div>
<div class="item"><a href=""><img src="" class="group1"></a></div>
</div>
<div class="group">
<div class="item"><a href=""><img src="" class="group2"></a></div>
<div class="item"><a href=""><img src="" class="group2"></a></div>
</div>
<div class="group">
<div class="item"><a href=""><img src="" class="group3"></a></div>
<div class="item"><a href=""><img src="" class="group3"></a></div>
<div class="item"><a href=""><img src="" class="group3"></a></div>
</div>

Answer 1

[Andrii]

Как вариант
var classes = {};
$(".item img").each(function(){
var className = $(this).attr('class');
classes[className] = true;
});
for(var elem in classes){
$(".item img." + elem).closest(".item")
.wrapAll('');
}

https://jsfiddle.net/j1j7639a/

Comments

[Andrii]

improve

$(".item img").each(function(){
var className = $(this).attr('class');
if(!$(this).closest(".item").parent().hasClass(className)){
$(this).closest(".item").wrapAll('');
}
});

[Дима Паутов]

Большое спасибо!

[Дима Паутов]

werdon: Улучшенный код мне каждый блок оборачивает!

[Andrii]

https://jsfiddle.net/hadson/fums4tho/1/