Creating and Wrapping Elements in jQuery

Before wrapping the tag, you can first create the element in the document. Let's wrap the paragraphs below in '<div></div>' tags:

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

To do this, you can first create an element in the document using document.createElement('div'):

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

Or:

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

You can pass not only the tag name as a parameter, but also this construction - '<div></div>' - in this case the effect will be absolutely the same:

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

HTML the code will look like this:

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>

When using the second method, you can write any attributes in the opening tag (in our case '<div>'), and the wrapping will be done along with these attributes.

Let's wrap our paragraphs in a div with a class of zzz:

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

HTML the code will look like this:

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>