I got a simple JavaScript that changes the inner HTML of an element when links are clicked, it looks like this:

```
function changeHeader(Index)
{
    var headers = new Array("Coffee tables","Side tables","Stand tables","Dinner tables","Stools","Pedestals");
    document.getElementById("header").innerHTML = headers[Index];

}

```

The CSS for `header` is below:

```
#header
{
    cursor: hand; 
    cursor: pointer;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

```

And the HTML is basically this:

```
<p id="header">Press a link</p>
<a href=# onclick="changeHeader(1)">Coffee tables</a>
<a href=# onclick="changeHeader(2)">Side tables</a>
<a href=# onclick="changeHeader(3)">Stand tables</a>

```

And so on. My problem is that I'd like to have different background colors on the `header` element depending on what link is pressed. The first link might get a red background, the second a blue, the third a green and so on.. 

How can I use JavaScript to add a property to an already existing CSS id? I don't use jQuery, so only pure JavaScript please :)