Skip to content
Related Articles

Related Articles

Improve Article
jQuery | Remove Elements
  • Last Updated : 27 Feb, 2019

In jQuery, in order to remove element and content you can use anyone of the following two jQuery methods:
Methods:

  • remove() – It is used to remove the selected element (and its child elements).
  • empty() – It is used to removes the child elements from the selected element.

Example-1: Using the jQuery remove() Method.




<!DOCTYPE html>
<html>
  
<head>
    <title>jQuery remove() Method</title>
  
  <script src=
  </script>
</head>
  
<body>
    <center>
        <h1 style="color:green;">  
            GeeksForGeeks</h1>
        <h2 id="GFG">
          jQuery remove() Method</h2>
        <br>
        <button>Click</button>
        <script>
            $(document).ready(function() {
                $("button").click(function() {
                    $("#GFG").remove();
                });
            });
        </script>
    </center>
</body>
  
</html>

Output:

Before Click on the Button:

After Click on the Button:



Example-2: Using the jQuery empty() Method.




<!DOCTYPE html>
<html>
  
<head>
    <title>jQuery empty() Method
  </title>
    <script src=
  </script>
</head>
  
<body>
    <center>
        <h1 style="color:green;">  
            GeeksForGeeks</h1>
        <h2 id="GFG"> jQuery empty() Method
      </h2>
        <br>
        <button>Click</button>
        <script>
            $(document).ready(function() {
                $("button").click(function() {
                    $("#GFG").empty();
                });
            });
        </script>
    </center>
</body>
  
</html>

Output:

Before Click on the Button:

After Click on the Button:




My Personal Notes arrow_drop_up
Recommended Articles
Page :