Creación y envoltura de elementos en jQuery

Antes de envolver con una etiqueta, puedes crear previamente un elemento en el documento. Vamos a envolver los párrafos presentados a continuación en las etiquetas '<div></div>':

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

Para ello, puedes crear previamente un elemento en el documento usando document.createElement('div'):

javascript$('.www').wrap(document.createElement('div'));

O también:

javascriptlet div = document.createElement("div");
$('.www').wrap(div);

Como parámetro, no solo puedes pasar el nombre de la etiqueta, sino también una construcción como '<div></div>' - en este caso, el efecto será exactamente el mismo:

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

El código HTML quedará así:

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

Al usar la segunda forma, en la etiqueta de apertura (en nuestro caso '<div>') se pueden escribir cualquier atributo, y la envoltura se realizará incluyendo esos atributos.

Vamos a envolver nuestros párrafos con un div con la clase zzz:

javascript$('.www').wrap('<div class="zzz"></div>');

El código HTML quedará así:

html<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>