Avvolgere più elementi in jQuery

Puoi avvolgere non ogni elemento separatamente, ma tutti gli elementi trovati insieme con il metodo wrapAll.

Nel codice HTML è presente un gruppo di paragrafi:

html<p class="www">testo</p>
<p class="www">testo</p>
<p class="www">testo</p>
<p>testo</p>

Troviamo tutti i paragrafi con la classe www e avvolgiamoli in un unico tag div:

javascript$('.www').wrapAll('<div></div>');

Il codice HTML risulterà così:

html<div>
<p class="www">testo</p>
<p class="www">testo</p>
<p class="www">testo</p>
</div>
<p>testo</p>

Tieni presente che se gli elementi da avvolgere non si trovano uno accanto all'altro, il metodo wrapAll prima sposterà gli elementi nello stesso posto, e poi li avvolgerà. Guarda il seguente esempio:

html<p class="www">testo1</p>
<p class="www">testo2</p>
<p>testo</p>
<p class="www">testo3</p>

Applichiamo il metodo wrapAll:

javascript$('.www').wrapAll('<div></div>');

Di conseguenza, otteniamo il seguente codice HTML:

html<div>
  <p class="www">testo1</p>
  <p class="www">testo2</p>
  <p class="www">testo3</p>
</div>
<p>testo</p>

I metodi di avvolgimento degli elementi prevedono anche la possibilità di applicare una funzione a ciascun elemento nell'insieme.