Skip to content
Advertisement

Change table cell text color and background of row based on text in the table without table tag

I have a table which has column that contain status. Two statuses, “Open” and “Closed” are in the last column of the table.

I would like to change the cell text color of “Closed” to red and the row backround color of “Open” to green.

Any advice would be helpful.

EDIT: I would like to find out how to assign above described colors based on text context (Open, Closed) in the last column of the table with javascript.

HTML:

JavaScript

CSS:

JavaScript

Advertisement

Answer

Easy!

JavaScript

and

JavaScript

for the row, and

JavaScript

and

JavaScript

for the cell

A quick’n’dirty(!) solution to iterate over each row and add the classes dynamically:

JavaScript

Untested, but should work.

Advertisement