jQuery Wrap

We have different types of wrap methods

wrap() - Removes the parent of the selected element
unwrap() - Wraps an HTML structure around each element in the set of matched elements
wrapAll() - Wraps an HTML structure around all elements in the set of matched elements
wrapInner() - Wraps an HTML structure around the content of each element in the set of matched elements

Example

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>jQuery Wrap Example 1</title>
  <script src="https://code.jquery.com/jquery-3.6.4.min.js"></script>
  <script>
    $(document).ready(function() {
      $("#wrapDivButton").click(function() {
        $("#wrapDivTarget").wrap("<div class='wrapper'></div>");
      });
    });
  </script>
  <style>
    .wrapper {
      border: 2px solid blue;
      padding: 10px;
    }
  </style>
</head>
<body>

<button id="wrapDivButton">Wrap with &lt;div&gt;</button>
<p id="wrapDivTarget">Content to be wrapped</p>

</body>
</html>

Run

Quick Recap - Topics Covered

jQuery Wrap

Practice With Examples in Compilers

The Concepts and codes you leart practice in Compilers till you are confident of doing on your own. A Various methods of examples, concepts, codes availble in our websites. Don't know where to start Down some code examples are given for this page topic use the code and compiler.

Example 1

jQuery Wrap

Quick Recap - Topics Covered

Practice With Examples in Compilers

Quiz