jQuery racchiude più elementi div sulla stessa class

Ciao, vorrei usare jQuery per racchiudere insiemi di elementi di class in un div ma non riesco a trovare la soluzione

HTML:

content
content
content
content
content

Risultato desiderato:

 
content
content
content
content
content

Grazie per il vostro aiuto in anticipo!

Demo http://jsfiddle.net/kQz4Z/8/

API: http://api.jquery.com/wrapAll/

Aggiunta una linea di interruzione in modo da poter vedere la differenza qui 🙂 http://jsfiddle.net/kQz4Z/10/

codice

 $(function() { $('.first').wrapAll('
') $('.second').wrapAll('
') $('.third').wrapAll('
') alert($('.view-content').html()); });​

Usa il metodo wrapAll ()

 $(function(){ var classs = ['.first', '.second', '.third']; for (i = 0; i < classes.length; i++) { $(classes[i]).wrapAll('
'); }​ });

Demo: http://jsfiddle.net/g9G85/

O ecco la soluzione dynamic molto breve:

 ​$(".view-content > div").each(function() { $(".view-content > ." + this.className).wrapAll("
"); });​

DEMO: http://jsfiddle.net/CqzWy/

Puoi usare .wrap() per avvolgere qualcosa in un div ma se il tuo contenuto non è ordinato diventerà un disastro, ecco un esempio:

Ingresso

 
content
content
content

Produzione

 
content
content
content

Potresti provare con questo:

 var arr = $(".view-content div").map(function() { return $(this).attr('class'); }).get(); var results = $.unique(arr); var i; for(i = 0; i < results.length; i++){ $('.out').append('
'); $('.'+results[i]).clone().appendTo('.columns:last'); } alert($('.out').html());

Ecco un esempio:

JSFIDDLE