Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript jQuery Basics Working with jQuery Collections Changing Element Styles and Classes

'background-color vs 'backgroundColor'

I wrote my CSS method with 'background-color' as the first argument and not 'backgroundColor' and it worked. What does that mean? Is it just bad practice? Will some properties not work if I type them out the CSS way or is it just convension to name them the JS way?

3 Answers

Carlos Zuluaga
Carlos Zuluaga
21,184 Points

Hi Nick Burton,

To change a CSS property on the DOM using JavaScript you need to use the appropriate syntax, i.e., backgroundColor instead of background-color.

To set the style of an element on JavaScript use *element*.style.*cssPropertyDOMNotation*.

I'm not entirely sure if typing CSS version could work in every case. But definitely, camelCase is a standard on JavaScript DOM Manipulation for CSS properties.

Please refer to the Common CSS Properties Reference on MDN

Late reply, but what you described is a JQuery feature:

Also, jQuery can equally interpret the CSS and DOM formatting of multiple-word properties. For example, jQuery understands and returns the correct value for both .css( "background-color" ) and .css( "backgroundColor" )

Cool. I'll be sure to continue using camelcase. Thanks a lot!