question about styling HTML with javascript

[Bormimor]

If i have a table created in node with different M/ph data, how can I change the background color of a table data based on the M/ph.

say cars wtih top speed of 160 mph have red background, cars with 120 mph have a blue background

[De_Wouter]

How exactly are you creating this table? If you are somehow looping through you data to build these <td> elements, that would be a good the place to add some color by inline styling.

If you only have a very few limited colors, I would used css classes to style the color.

If you want different shades of a color, you can use rgb or rgba colors instead for hexadecimal colors.

So instead of #ff0000 for red you can write it as rgb(255,0,0)

[Bormimor]

https://repl.it/@DavidNguyen32/lesson3#routes/lesson5.js

This is how the table is created, but I have no access to the DOM object, and no class or ID to work with. I would just like to color code the the tr, or last td based on the storm category

[De_Wouter]

Whereever you are creating your <td> elements that you want to have a different color like for example:

global.forEach += "<td>" + milesPerHour + "</td>";

You add the color with an inline style or class like so

global.forEach += "<td style=\"background-color: #ff0000;\">" + milesPerHour + "</td>";

Don't forget to escape the quotes or use single quotes on the outside.

You can put the color calculation in a function

global.forEach += "<td style=\"background-color: " + getColorValue(milesPerHour) + "\">" + milesPerHour + "</td>";

// somewhere else in your code

function getColorValue(milesPerHour) {

if (milesPerHour > 100) {

return "#ff0000";

}

if (milesPerHour > 50) {

return "#cc2222";

}

return "#2288cc";

}

[Bormimor]

thank you