jQuery delete all table rows except first header row

Whenever you want to show row values dynamically into the table at that time table row should be refreshed. And for that purpose you can try this code.

Simply, I have used the following code and it works great.

$("#Table_Id tr:gt(0)").remove();

Here, you can see #Table_Id is the identity of the table and tr:gt(0) means table row greater than zero means it leaves the first row of the table. 

 

The :gt(0) selector selects all elements with an index greater than 0, which in this case will select all table rows except the first one. The remove() method is then used to remove those selected rows from the table.

The same stuff can be done in different ways. I can give you another example.

To delete all table rows except the first (header) row using jQuery, you can use the :not selector along with the :first selector to target all rows except the first one, and then use the remove() method to remove them. Here's an example:

$("table tr:not(:first)").remove();

This will select all tr elements that are not the first (header) row, and remove them from the table.

The empty() method can be used in place of remove() to delete all table rows except the first header row. The difference between the two methods is that empty() only removes the contents of the selected elements, while remove() removes the elements themselves, including their contents and data/events.

$("#Table_Id tr:gt(0)").empty();

This will remove all child elements, text, and data from all rows except the first row of table with id 'Table_Id'.

In most cases using remove() or empty() will not make any difference, but if you are using any event listener or data on the element then it is better to use empty() as it will not remove the events or data associated with that element.