How to change Background Color of an element with Javascript and set it as IMPORTANT-CodePudding

I know by this code I can change the color of an element to something else and set it as !important:

document.getElementById("usernamestatus").style.setProperty('color', 'red', 'important');

But I don't know how to change the background-color of an element by using this syntax.

In fact I tried this but didn't change the background:

document.getElementById("usernamestatus").style.setProperty('backgroundColor', 'red', 'important');

So if you know, please let me know...

I would really appreciate any idea or suggestion from you guys.

Thanks in advance.

CodePudding user response：

It should be background-color not backgroundColor:

document.getElementById("usernamestatus").style.setProperty('background-color', 'red', 'important');

#usernamestatus {
width: 200px;
height: 200px;
background-color: blue;
}

<div id="usernamestatus"/>