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 )

Parameters

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>
</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>
</div>

For more information go to jQuery references.

Based on United States, Jacob Frazier is a skilled JavaScript developer with over 8 years of experience. He is passionate about change and trying new things, both professionally and personally. He loves startups and is extremely proactive.

You may like:  jQuery serializeArray() key value pairs

Leave a Reply

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