jQuery Document Manipulation - wrapInner() Method

Example

Wrap b elements around the content of each p element:

$(".btn1").click(function(){
   $("p").wrapInner("<b></b>");
});

Try it yourself

Definition and Usage

The wrapInner() method uses the specified HTML content or element to wrap all content (inner HTML) within each selected element.

Syntax

$().wrapInner(wrapper)
Parameters Description
wrapper

Required. Specifies the content wrapped around the content of the selected elements.

Possible values:

  • HTML code - for example ("<div></div>")
  • New DOM element - for example (document.createElement("div"))
  • Existing elements - for example ($(".div1"))

Existing elements will not be moved, they will only be copied and wrapped around the selected elements.

Wrap content using a function

Use a function to specify the content wrapped around each selected element.

Syntax

$().wrapInner(function())

Try it yourself

Parameters Description
function() Required. Specifies the function that returns the wrapping element.

More examples

Use the new element to wrap
Create a new DOM element to wrap each selected element.