CODEWITHSUNDEEP
javascript
Shuinvy
Shuinvy

Reputation: 251

How to change td.style when dynamic add table row

I use JavaScript to add table rows dynamically, but I don't know how to change the style of the table data. My code is:

var tableis = document.getElementById("cameraTable");
var last=(-1);
var Tr = tableis.insertRow(last);
var Td1 = Tr.insertCell(0);
Td1.innerHTML="<div name='mac"+i+"' id='mac"+i+"'>"+mac+"</div>";
Tr.appendChild(Td1);

and I only know how to change the background of the td:

Td1.bgColor="#00FF00";

I want to change the border style of the td, is it possible? The style is like:

style="border: 1px solid black;"

I have tried Td1.style="border: 1px solid black;" but it is no effort.

Any answer appreciated.

Upvotes: 0

Views: 16395

Answers (2)

palaѕн
palaѕн

Reputation: 73926

You can do this using the HTMLElement.style:

Td1.style.border = '1px solid black';

Simple Demo Here

Upvotes: 5

flakomalo
flakomalo

Reputation: 710

I think a more elegant solution would be to have the CSS class defined rather than hard-coding the style in the cell.

/* CSS Class */
.cellStyle{
     border: 1px solid black;
     background-color: #00FF00;
}

/* JavaScript Code */
Td1.className = 'cellStyle';

Upvotes: 5

Related Questions