How do I change the color of text in javascript?

Question

I wrote a javascript code displaying the date. How would I change the color?

Answer 1

You need to put the text in a separate element, then change the element's color CSS property.

This is easiest to do using jQuery:

<span id="date">Please enable JavaScript</span>

$('#date').text(new Date().toString()).css('color', 'red');

However, you might want to do it with pure CSS:

(In the head tag:)

<style type="text/css">
    #date {
        color: red;
    }
</style>

Answer 2

You could set inline CSS properties of the element where you display the date, by using the element.style property:

var el = document.getElementById('elementId');
el.innerHTML = date; // set the text
el.style.color = '#ff0000'; // set the text color

Or you could apply a CSS class programmatically:

el.className = 'yourclass';