Add New Table Row at bottom
Example
1 | John | 654 |
<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js"></script>
<script>
$(document).ready(function() {
//Try to get tbody first with jquery children. works faster!
var tbody = $('#myTable').children('tbody');
//Then if no tbody just select your table
var table = tbody.length ? tbody : $('#myTable');
$('button').click(function(){
//Add row
table.append('<tr><td>2</td><td>Mick</td><td>254</td></tr>');
})
});
</script>
</head>
<body>
<button>Add row</button>
<table id="myTable">
<tbody>
<tr>
<td>1</td>
<td>John</td>
<td>654</td>
</tr>
</tbody>
</table>
</body>
</html>
Most Helpful This Week
How to check if an element or HTML tag exists using JavaScript?
How to show hide option list items using jQuery?
How can I redirect the user from one page to another using jQuery or pure JavaScript?
ES6 method of declaration multiple variables in one line
Example to take user input and display on screen using JavaScript
How to the length of the longest word in the provided sentence?