Question

I am working with a javascript function which takes a value from a <input type="text" /> and then write it as a text without being an input. I do this using innerHTML and it works perfectly.

My question is: How can I use a CSS class to edit the color and size of the text I am writting with innerHTML

var element = document.getElementById("element");
var value = document.getElementById("value").value;
element.innerHTML = value;

Thank You!

Answer 1

JavaScript:

element.className = 'foo';
// or
element.className += ' foo';

CSS:

.foo {
    color: #F00;
    font-size: 2em;
}

---

Or, more advanced: elem.classList.add( 'foo' ); (As usual, IE gets the polyfill via conditional comments.)
– Šime Vidas