how to add class to button by using appendChild?

Question

i have created a button like this

var btn=document.createElement('BUTTON');
var t=document.createTextNode("X");
btn.appendChild(t);
x.appendChild(btn);

how can i add class to this button?

Answer 1

Not by using .appendChild(), but rather by setting the .className property on the created element itself:

btn.className = "myclass";

Or if you don't care about older browsers, you can use .classList:

btn.classList.add("myClass");

Answer 2

use:

btn.className = btn.className + "test";

Answer 3

$(btn).css('font-weight','bold') or $(btn).addClass('className');

all is OK.

Answer 4

• with jQuery:

  $(btn).addClass('your-class');
  

  (see jQuery docs)

• without jQuery:

  btn.className = 'your-class';
  

Answer 5

Try btn.className after createElement

var btn=document.createElement('BUTTON');
btn.className = "CLASS_NAME";
var t=document.createTextNode("X");
btn.appendChild(t);
x.appendChild(btn);