Question: **So for example I can do this:**

```
document.getElementById('element').onclick = function() {
    document.getElementById('element').style.color = '#FFFFFF';
}

```

**But how should I do this?**

```
document.getElementById('element').onclick = function() {
    document.getElementById('element').style.-moz-box-shadow = '1px 1px 1px #000'; 

}

```

I hope you get what I mean :) 

Please do not post any answer related with jQuery or any library, I want it in plain javascript.

Answer: 
I believe it's:

```
myobject.MozBoxShadow = '1px 1px 1px #000';

```

It doesn't follow the "typical" formatting of a style object (which would lower-case the "M") because of the initial "-" character. Converting between style properties and JS properties for those styles means:

1. Converting the first character to lower case
2. Converting all characters after dashes to upper case
3. Removing all dashes

Thus, "-moz-box-shadow" becomes:

1. -moz-box-shadow (the first character is a "-", so it doesn't have a lower case)
2. -Moz-Box-Shadow
3. MozBoxShadow
I think you change '-' to a capital letter, so:

```
 document.getElementById('element').style.-moz-box-shadow = 1px 1px 1px #000;

```

Should be:

```
  document.getElementById('element').style.MozBoxShadow = "1px 1px 1px #000";

```