How can I get firefox to set style attributes using the style ['attribute-name'] =?

Question

In this example, Chrome sets red background, firefox and IE.

Attempt:

document.getElementById("firefoxDiv").style['backgroundColor'] = "Red"; 

and

 document.getElementById("firefoxDiv").style['background-color'] = "Red"; 

I would rather use the same syntax that was used in the external CSS background-color vs inline using javascript .style.backgroundColor =

Thank you for your help!

Note: NO jQuery please.

Answer 1

Use .style.setProperty(propertyName, value [, priority]) instead of the expando property.

Example:

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