jQuery remove() Method
Last Updated :
10 Jul, 2023
The remove() method in JQuery is 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.
Example 1: In this example, we are using jQuery remove method.
html
<!DOCTYPE html>
<html>
<head>
<script src=
//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:
We can also find and remove elements using their class name with the help of JQuery remove() method.
Syntax:
$(".class_name").remove()
Return value: It will return all the portions deleted on the page with the class name.
Example 2:
Input: $(".geek").remove()
Output: Here "gfg!!!" get deleted.
Example 2: In this example, we are using jQuery remove() method.
html
<!DOCTYPE html>
<html>
<head>
<script src=
//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:
Like Article
Suggest improvement
Share your thoughts in the comments
Please Login to comment...