It is easy to remove existing HTML elements.
Remove Elements/Content
To remove elements and content, there are mainly two jQuery methods:
remove()
– Removes the selected element (and its child elements).empty()
– Removes the child elements from the selected element.
jQuery remove() Method
The jQuery remove()
method removes the selected element(s) and its child elements.
Example :-
<script>
$(document).ready(function(){
$(“.btn-one”).click(function(){
$(“p”).remove();
});
});
</script>
<body>
<p >This is Roshan Kumar Jha</p>
<button type=”button” class=”btn-one” >click</button>
</body>
jQuery empty() Method
The jQuery empty()
method removes the child elements of the selected element(s).
Example :-
<script>
$(document).ready(function(){
$(“.btn-one”).click(function(){
$(“#rk”).empty();
});
});
</script>
<body>
<div id = “rk” style = “height :100px; width:100px; border: 1px solid black;”>
<p>This is some text in the div.</p>
<p >This is Roshan Kumar Jha</p>
</div>
<br>
<button type=”button” class=”btn-one” >click</button>
</body>