jQuery CSS not applying

Question

Is there any reason that this CSS shouldn't work?

$('.selector').css(
            'background-color', '#74d04c',
            '-webkit-box-shadow','inset 0px 1px 0px 0px #dbf383, inset 0px -1px 1px #58c43a',
            '-moz-box-shadow','inset 0px 1px 0px 0px #dbf383, inset 0px -1px 1px #58c43a',
            'box-shadow','inset 0px 1px 0px 0px #dbf383, inset 0px -1px 1px #58c43a',
            'border','1px solid #4c8932'
            );

The only one that is showing is the background-color.

Answer 1

.css takes either a property name and value, or a map. You can do this:

$('.selector').css('color','blue');

...or this:

$('.selector').css({'color':'blue', 'left':'100px'});

The problem is that you're mixing the two approaches. Instead, try it like this:

$('.selector').css({
  'background-color':'#74d04c',
  '-webkit-box-shadow':'inset 0px 1px 0px 0px #dbf383, inset 0px -1px 1px #58c43a',
  etc...
});