Removing box shadow from element using jquery
css, jquery
Solution
To override these styles, you need to explicitly specify `'none'` instead of just `''`:
$('.pagewrap .page').css({'-webkit-box-shadow' : 'none', '-moz-box-shadow' : 'none', 'box-shadow' : 'none'});
This works: http://jsfiddle.net/8PV5v/
And as Frédéric points out, `moz-box-shadow` should be `-moz-box-shadow` - replace this everywhere you've used it.
Problem
I'm trying to remove the box shadow from an element which I defined in css like this: ``` .pagewrap .page { moz-box-shadow:0 1px 2px #fff,0 -1px 1px #666,inset 0 -1px 1px rgba(0,0,0,0.5),inset 0 1px 1px rgba(255,255,255,0.8);-webkit-box-shadow:0 1px 2px #fff,0 -1px 1px #666,inset 0 -1px 1px rgba(0,0,0,0.5),inset 0 1px 1px rgba(255,255,255,0.8);box-shadow:0 1px 2px #fff,0 -1px 1px #666,inset 0 -1px 1px rgba(0,0,0,0.5),inset 0 1px 1px rgba(255,255,255,0.8); } ``` I use the following jquery to get rid of the box shadow, but that doesn't seem to work: ``` $('.pagewrap .page').css({'-webkit-box-shadow' : '', 'moz-box-shadow' : '', 'box-shadow' : ''}); ``` What am I doing wrong here? Thanks.