Changing css with javascript + !important

[qwertyuiop]

Hi,
How can you add an !important keyword to the end of a css declaration via javascript? The !important part is removed automatically.


document.getElementById('logo').style.backgroundImage = "url(" + variable + ") !important";

[_Aerospace_Eng_]

style.cssProperty is only changing inline styles not external stylesheets. Search on javascriptkit.com on how to change CSS properties as in an embedded or external CSS file.

[qwertyuiop]

I'm kinda confused. I'm fine with it changing the inline styles. AFAIK, you can have !important in the inline styles too.

[liorean]

Inline styles always override all other styles (except user !important), so you wouldn't see if !important was supported or not.

[qwertyuiop]

So !important isn't necessary for inline styles?

I have a background-image randomizer, it works in Firefox and IE, but not Opera. Doe Opera have a problem with changing background-images?

Javascript:
function loadLogo(){
var random = (Math.round(Math.random()*(logos.length-1)));

document.getElementById('logo').style.backgroundImage = "url(images/" +logos[random]+ ")";
}

CSS:
#logo {
width: 800px;
height: 100px;
margin: 0 auto;
text-indent: -9999px;
background: #fefefe url(images/logo2.png) no-repeat;
}