jQuery wrapInner() Method

jQuery wrapInner() method wraps an HTML structure around the inner content (innerHTML) of each selected element.

Syntax

Here is a wrapInner() method syntax

$(selector).wrapInner( wrappingElement, function(index) );

Parameter	Type	Description
wrappingElement	Selector htmlString Element jQuery	Required. Specifies the HTML structure to wrap around the inner content of each matched elements.
function(index)	Function	Optional. Specifies the callback function that returning the wrapping element. index - Return the index position of the element in the set as an argument.

Example

Here, in this example HTML structure wrap around the inner content.

<!DOCTYPE html>
<html>
<head>
  <title>jQuery wrapInner() method</title>
  <script src="jquery-latest.min.js"></script>
  <script>
    $(document).ready(function(){
      $("button").click(function(){
        $("p").wrapInner("<u></u>");
      });
    });
  </script>
</head>
<body>
  <p>First paragraph text</p> 
  <p>Second paragraph text</p>
  <br />
  <button>Click here to call wrapInner() method</button>
</body> 
</html>

Run it... »