jQuery wrap() Method

event.preventDefault() and return false

jQuery wrap Method wraps specified HTML element(s) around each element in the set of matched elements.

This wrapping process is very useful for injecting any additional structure into a document, without destroying the original semantic qualities of the document.

Possible values are:

  • HTML elements
  • jQuery objects
  • DOM elements

This is the simple syntax to use this method.

selector.wrap( html )


elem – A string of HTML which will be created on the fly and wrapped around each target.

Following is a simple example with a simple usage of this method.

<div class="main">
<div class="sub">John Doe</div>
<div class="sub">Jane Doe</div>

Read Also:

Now, .wrap() can insert an HTML structure around the each inner <div> elements as below:

$( ".sub" ).wrap( "<div class='wrap'></div>" );

The result will be:

<div class="main">
<div class="wrap"><div class="sub">John Doe</div></div>
<div class="wrap"><div class="sub">Jane Doe</div></div>

For more information go to jQuery references.

Leave a Reply

Your email address will not be published. Required fields are marked *