CSS not rendering appended HTML elements in Playground

Question

In a program (run with browser, not Playground) that injects HTML elements, the defined class of the element (defined in the js file) will usually be recognized by the CSS file and rendered by it.

However, in Playground, this doesn’t happen, and the element is left untouched by the CSS file.

Are there any workarounds for this problem? Or do I have to define the CSS style in the style attribute of the element?

Thanks.

Answer 1

The problem is actually the .class property. The right way to add the class is .className.
text.className = "text-element";

Answer 2

It does happen In playground too.
Please show your code.

Answer 3

https://code.sololearn.com/Wb2VlHgq9DA6/?ref=app

read the css. the text should be red. whats happening is the SL server is running the HTML, then the CSS, then the JS. The CSS doesnt recognize it because it isnt running constantly

Answer 4

Thanks, it worked.

Answer 5

You can try that way in JS:
text.style.color = "red";

Answer 6

Thats what I’m tryin to avoid, but thanks for you answer Boris Batinkov.