Usean elementin kääriminen jQueryssä

Voit kääriä ei jokaista elementtiä erikseen, vaan kaikki löydetyt elementit yhdessä käyttämällä metodia wrapAll.

HTML-koodissa on esitetty ryhmä kappaleita:

<p class="www">teksti</p>
<p class="www">teksti</p>
<p class="www">teksti</p>
<p>teksti</p>

Etsitään kaikki kappaleet, joissa on luokka www ja kääritään ne yhdessä div-tagiin:

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

HTML-koodi muuttuu näyttämään tältä:

<div>
<p class="www">teksti</p>
<p class="www">teksti</p>
<p class="www">teksti</p>
</div>
<p>teksti</p>

Huomioi, että jos kääritävät elementit eivät ole vierekkäin, metodi wrapAll siirtää ensin elementit yhteen paikkaan ja vasta sitten käärii ne. Katso seuraavaa esimerkkiä:

<p class="www">teksti1</p>
<p class="www">teksti2</p>
<p>teksti</p>
<p class="www">teksti3</p>

Käytetään metodia wrapAll:

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

Lopputuloksena saamme seuraavan HTML-koodin:

<div>
	<p class="www">teksti1</p>
	<p class="www">teksti2</p>
	<p class="www">teksti3</p>
</div>
<p>teksti</p>

Elementtien käärimismenetelmät tarjoavat myös mahdollisuuden soveltaa funktiota jokaiseen joukon elementtiin.

Kääri kaikki h2 yhdeksi i:ksi.