.wrap()

Syntax

.wrap(wrappingElement): wrappingElement: An HTML snippet, selector expression, jQuery object, or DOM element specifying the structure to wrap around the matched elements
.wrap(wrappingFunction): wrappingFunction: A callback function that generates a structure to wrap around the matched elements

Return value

The jQuery object, for chaining purposes.

Description

Wrap an HTML structure around each element in the set of matched elements.

Examples

Consider the following HTML code:

 
<div class="container">
 <div class="inner">Hello</div>
 <div class="inner">InnerText</div>
</div>

Insert an HTML structure around the inner <div> elements:

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

Results:

 
<div class="container">
 <div class="new">
 <div class="inner">Hello</div>
 </div>
 <div class="new">
 <div class="inner">InnerText</div>
 </div>
</div>

Specify a callback function.

This function is called for every matched element.

It should return a DOM element, a jQuery object, or an HTML snippet in which to wrap the corresponding element. For example:

 
$('.inner').wrap(function() {
 return '<div class="' + $(this).text() + '" />';
});

Results:

 
<div class="container">
 <div class="Hello">
 <div class="inner">Hello</div>
 </div>
 <div class="InnerText">
 <div class="inner">InnerText</div>
 </div>
</div>