[Solved] document.createElement(‘div’) with a class [duplicate]

Question

I can use createElement() to create an HTML element via JavaScript like this:

let div = document.createElement('div');

But how can I add a CSS class to my newly created div?

I tried something like this, but didn’t work:

let div = document.createElement('div class=myDiv');

Enquirer: user1941537

||

Source

Answer 1

Solution #1:

Do div.classList.add

let div = document.createElement('div');
div.classList.add('test');
let text = document.createTextNode('Test');
div.appendChild(text);
document.body.appendChild(div)

.test {
  color: green;
}

Expand snippet

You can also do by className

let div = document.createElement('div');
div.className = 'test';
let text = document.createTextNode('Test');
div.appendChild(text);
document.body.appendChild(div)

.test {
  color: red;
}

Expand snippet

Respondent: brk

Answer 2

Solution #2:

You can use Element.classList.add

let div = document.createElement('div');
div.classList.add("myDiv")

Respondent: R3tep

[Solved] document.createElement(‘div’) with a class [duplicate]

Solution #1:

Solution #2:

Related Posts:

Leave a Reply Cancel reply