How to add table row in jQuery


Add table row in jQuery: Here in this article, we learn 4 different ways to add table row in jQuery on button click. i.e how to append a row to the table. Methods like .append(), prepend(), .after() and .before() are used to add table rows.

Let's see each of these methods with an example. Before that, we just add a button and table and 2 textboxes for our example.

Here HTML code looks like as shown below


Name <input id="txtName" type="text" /> Location <input id="txtLocation" type="text" />
<button id="btnAddRow">Add New Row </button>
<table border="1" id="myTable">
  <tr id="trow">
    <td>Satinder singh</td>

# Using .append()

By using the .append() method we add elements at the end of the table i.e at the last index.

Thank you for reading, pls keep visiting this blog and share this in your network. Also, I would love to hear your opinions down in the comments.

PS: If you found this content valuable and want to thank me? 👳 Buy Me a Coffee

Subscribe to our newsletter

Get the latest and greatest from Codepedia delivered straight to your inbox.

Post Comment

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