CODEWITHSUNDEEP
javascripthtmlcss
Loreno
Loreno

Reputation: 668

How to apply CSS style in javascript for id generated at runtime

In my code I have a table, to which I'd like to apply this style:

#tableDiv tr:nth-child(even) {
    background-color: grey;
}

In the above code div's id is known (it's tableDiv). In my project div's id is generated during runtime and it's some random string. How can I apply the style in javascript code. Let's say I generated my div's id like this:

mContainer = document.createElement("div");
newId = divIdGenerator();
mContainer.setAttribute("id", newId);

What should I do next to apply my style?

Upvotes: 0

Views: 426

Answers (2)

Satpal
Satpal

Reputation: 133403

You should use CSS class

var mContainer = document.createElement("div");

//adds class "table-div" to element
mContainer.classList.add('table-div');

.table-div tr:nth-child(even) {
  background-color: grey;
}

Upvotes: 2

connexo
connexo

Reputation: 56744

Add a CSS class that does this for you:

.striped-table tr:nth-child(even) {
  background-color: grey;
}

and then add the class to the classlist:

mContainer.classList.add("striped-table");

Upvotes: -1

Related Questions