Etienne
Etienne

Reputation: 109

How do I add a className to a div tag in JavaScript?

See my code below:

var newcontent = document.createElement('div');
    newcontent.innerHTML = 'draggable';
    newcontent.className = 'myclass';
    document.body.appendChild(newcontent.firstChild);

Upvotes: 0

Views: 93

Answers (3)

priya786
priya786

Reputation: 1834

$("body" ).append("<div class='myclass'>draggabble</div>");
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>

you can try this

Upvotes: 0

Santosh Panda
Santosh Panda

Reputation: 7341

Your approach is perfectly fine. But you should declare your css class in your code, so that it will picked correctly by the element.

.myclass {
  color: red
}

Here goes your code:

    var newcontent = document.createElement('div');
    newcontent.innerHTML = 'draggable';
    newcontent.className = 'myclass';
    document.body.appendChild(newcontent.firstChild);

Upvotes: 0

Satpal
Satpal

Reputation: 133403

You need to append newcontent, Currently you are appending newcontent.firstChild which is a text node thus css class has no impact.

var newcontent = document.createElement('div');
    newcontent.innerHTML = 'draggable';
    newcontent.className = 'myclass';
    document.body.appendChild(newcontent);
.myclass {
  color: red
}

Upvotes: 2

Related Questions