Tuesday , February 28 2017
Home / jquery / JQuery Remove Elements Example

JQuery Remove Elements Example

In this tutorial we  are going to understand JQuery Remove Elements. Remove Elements in JQuery also as simple as adding the elements. In the previous tutorials, we have discussed about how to add the elements in JQuery.

JQuery Remove Elements :

We can remove the elements using the following methods :

  • remove()
  • empty()

JQuery remove() :

JQuery remove() is used to remove the selected element and its content (its child elements too).

$(“#target”).remove();

The above example is used to remove the element which is having id as target, and its child elements. It does permanent remove operation, once the remove() operation is happen, we can not get that elements back on DOM.

If we want to delete only the matched element, not to child elements. We can go with JQuery detach().

JQuery detach() :

JQuery detach() is used to delete the matched element only. It doesn’t delete the content of the matched element. detach() keeps all jQuery data associated with the removed elements.

This method is useful when removed elements are to be reinserted into the DOM at a later time. We can re attach the detached data using attach() method.

$(“#target”).detach();

JQuery removeClass() :

JQuery removeClass() is a legacy method. Which is used to remove the one or more class names for a matched elements.

$(“#target”).removeClass(“class1”);

OR

$(“#target”).removeClass(“class1 class2”);

JQuery empty() :

JQuery empty() is used to remove the child elements of matched element. This method is not used to remove selected elements or attributes.

$(“#target”).empty();

Even though empty() method is used to remove the child elements, it is also used to remove any content inside the matched elements.

Happy Learning 🙂

About chandrashekhar

Hi Folks, you have reach this so far, that shows you like what you are learning. Then why don't you support us to improve for bettor tutorials by leaving your valuable comments and why not you keep in touch with us for latest updates on your favorite blog @ facebook , twitter , Or Google+ ,

Check Also

jQuery Add Elements Example Tutorials

In JQuery, we can easyly add HTML elements at run time. In this tutorials we …

Leave a Reply

Your email address will not be published. Required fields are marked *