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>':
<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'):
$('.www').wrap(document.createElement('div'));
O también:
let 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:
$('.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>
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:
$('.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>
Envuelve cada h3 en un div
con la clase aaa.
