Método wrap
El método wrap envuelve
elementos en una etiqueta dada.
Sintaxis
El parámetro del método puede ser texto (posiblemente con etiquetas), un elemento DOM o un objeto jQuery:
.wrap(con qué envolver);
Así es como los elementos seleccionados se envuelven con el contenido, que será devuelto por la función personalizada. La función se llama por separado, para cada uno de los elementos seleccionados, como parámetro acepta la posición del elemento en el conjunto:
.wrap(function(número en el conjunto));
Ejemplo
Envolvamos todos los párrafos con la clase www con la etiqueta
div:
<p class="www">text</p>
<p class="www">text</p>
<p class="www">text</p>
<p>text</p>
$('.www').wrap(document.createElement('div'));
El código HTML quedará así:
<div><p class="www">text</p></div>
<div><p class="www">text</p></div>
<div><p class="www">text</p></div>
<p>text</p>
Ejemplo
Como parámetro se puede pasar no solo el nombre de la etiqueta, sino también la siguiente construcción:
<p class="www">text</p>
<p class="www">text</p>
<p class="www">text</p>
<p>text</p>
$('.www').wrap('<div></div>');
El código HTML quedará así:
<div><p class="www">text</p></div>
<div><p class="www">text</p></div>
<div><p class="www">text</p></div>
<p>text</p>
Ejemplo
En la etiqueta de apertura se pueden escribir cualquier atributo,
y el envoltorio incluirá estos
atributos. Envolvamos los párrafos con la clase
www con un div con la clase zzz:
<p class="www">text</p>
<p class="www">text</p>
<p class="www">text</p>
<p>text</p>
$('.www').wrap('<div class="zzz"></div>');
El código HTML quedará así:
<div class="zzz"><p class="www">text</p></div>
<div class="zzz"><p class="www">text</p></div>
<div class="zzz"><p class="www">text</p></div>
<p>text</p>
