Tutorialspoint.dev

jQuery | remove()

The remove() method in JQuery used to remove all the selected elements including all the text. This method also remove data and all the events of the selected elements.
Syntax:

$(selector).remove()

Return Value: It will return all the data of the selected elements deleted.
Example 1:

Input: $("p").remove()
Output: Output will be all the elements of the paragraph get deleted.

Code 1:

<html>
  
<head>
    <script src="https://ajax.googleapis.com/ajax/
                 libs/jquery/3.3.1/jquery.min.js">
        //this is JQuery CDN directed from the JQuery website
    </script>
    <script>
        $(document).ready(function() {
            $("button").click(function() {
                $("p").remove();
            });
        });
    </script>
</head>
  
<body>
    <div style="padding-left:220px;padding-top:100px;">
        <p style="font-size:35px;">Welcome to GFG!!!.</p>
        <button style="padding:15px;">Click ME</button>
    </div>
</body>
  
</html>

Output:
Before clicking the button :

After clicking on button :

We can also find and remove elements using its class name with the help of JQuery remove() method.
Syntax:

$(".class_name").remove()

Return value: It will return all the portion deleted on the page with the class name.
Example 2:

Input: $(".geek").remove()
Output: Here "gfg!!!" get deleted. 

Code #2:

<html>
  
<head>
                /jquery/3.3.1/jquery.min.js">
        //this is JQuery CDN directed from the JQuery website
    </script>
    <script>
        $(document).ready(function() {
            $("button").click(function() {
                $(".geeks").remove();
            });
        });
    </script>
</head>
  
<body>
    <div style="margin-left:180px; font-size:35px;padding-top:100px">
        <p class="geeks">Welcome to GFG!!!.</p>
        <p class="geeks">Hello, My class is geeks</p>
        <button>Click ME</button>
    </div>
</body>
  
</html>

Output:
Before clicking on button :

After clicking on button :

Except button everything get remove



This article is attributed to GeeksforGeeks.org

leave a comment

code

0 Comments

load comments

Subscribe to Our Newsletter