Adding a table row using javascript

From EKiniWiki

This example shows how you can add a table row using JavaScript. It includes examples on how you can set parameters (id, class, onmouseover, onmouseout) to table rows using JavaScript. It also shows you how to get the number of rows in a table using rows.length

[edit] The Javascript code

function addMisshipRow()
    {
        var tbl = document.getElementById('grid');
        var lastRow = tbl.rows.length;
        // if there's no header row in the table, then iteration = lastRow + 1
        var iteration = lastRow;
        
        var row = tbl.insertRow(lastRow);
        
        //An example of how you can set parameters for table rows using Javascript.
        //row.onmouseover = function() {hoverRow(this,'on');}
        //row.onmouseout = function() {hoverRow(this,'off');}
        row.className = 'row_off';
        row.id='row'+iteration;

        var col_1 = document.createElement('td');
        col_1.className  = 'col_count';
        col_1.style.cursor = 'pointer';
        col_1.onclick = function() { removeRowFromTable(iteration,0); };
        col_1.innerHTML =  '<i>This is italic.</i>';
        
        var col_2 = document.createElement('td');
        col_2.className  = 'col_count';
        col_2.style.cursor = 'pointer';
        col_2.onclick = function() { removeRowFromTable(iteration); };
        col_2.innerHTML = '<b>This is bold</b>';

        row.appendChild(col_1);
        row.appendChild(col_2);
} 

[edit] The HTML

<table id="grid">
    <tr>
        <td>Column A</td>
        <td>Cloumn B</td>
    </tr>
</table>

[edit] Other References

Modifying_table_row_using_javascript: shows an example on how you can modify a table row dynamically.