Skip to content
Related Articles

Related Articles

Improve Article
Save Article
Like Article

HTML | DOM Table insertRow( ) Method

  • Last Updated : 20 Nov, 2021

The Table insertRow() method is used for creating an empty <tr> an element which can be added to a table. 
It is generally used for inserting a new row(s) at the specified index in the table. 
A <tr> element contain atleast one <th> or <td> elements.


Parameters Used 

  • index: It is used to specify the position of the row to be inserted. The value 0 results in the insertion of the new row at the first position whereas -1 can be used to insert the new row at the last position.

Return Value : It returns  the inserted <tr> element

Below program illustrates the Table insertRow() method : 
Example-1: Inserting new row at the first position of a table. 


<!DOCTYPE html>
    <title>Table insertRow() method in HTML</title>
        td {
            border: 1px solid green;
        h1 {
            color: green;
        h2 {
            font-family: Impact;
        body {
            text-align: center;
    <h2>Table insertRow() method</h2>
<p>To add a new row at the first
      position of the table, double-click
      the "Add Row" button.</p>
    <table id="Courses"
            <td>Fork Java</td>
            <td>Fork Python</td>
    <button ondblclick="row()">
      Add Row
        function row() {
            var MyTable =
            // insert new row.
            var NewRow = MyTable.insertRow(0);
            var Newcell1 = NewRow.insertCell(0);
            var Newcell2 = NewRow.insertCell(1);
            Newcell1.innerHTML = "Placement";
            Newcell2.innerHTML = "Sudo Placement";


After clicking the button 

Supported Browsers: 

  • Apple Safari
  • Internet Explorer
  • Firefox
  • Google Chrome
  • Opera


My Personal Notes arrow_drop_up
Recommended Articles
Page :

Start Your Coding Journey Now!