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 > 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
leave a comment
0 Comments