Can I style a table with JS?

Hi,

I have a dynamic table using JS that allows me to add and remove rows with the click of a button. I need the style of the table to match that of the already existing table though.

So far this is my code for adding a new row;

[code=php]
var currentTxtBx = 1;

function addRowToTable(){

if (currentTxtBx<10){

var tbl = document.getElementById(‘tblSample’);
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);

// left cell
var cellLeft = row.insertCell(0);
var textNode = document.createTextNode(iteration);
cellLeft.appendChild(textNode);

// right cell
//var cellRight = row.insertCell(1);
var el = document.createElement(‘input’);
el.type = ‘text’;
el.name = ‘txtRow’ + iteration;
el.id = ‘txtRow’ + iteration;
el.size = 40;

cellLeft.appendChild(el);
currentTxtBx++;

}else{
alert(‘cannot add more than 10 boxes’);
}
}
[/code]

and this is my code for the already existing table;

[code=php]
<tr>
<td onmouseover=”mouseover_num1()” onmouseout=”mouseout_num1()” align=”center”>
<div id=”form_num1″>
Mobile / Cell Number 1:<br />
<input type=”text” name=”num1″ id=”num1″ size=”40″ maxlength=”40″/><br />
&nbsp;
</div>
</td>
</tr>
[/code]

Is there any way that I can have the JS set these attributes? Also, values such as num1 would need to be dynamic as for the second row the value would be num2 etc.

Thanks

Also in #JavaScript _↴