Applying css3 gradients with jQuery

Your second approach looks OK... Maybe you need to css styles for non-webkit browsers as well... Cross-Browser CSS Gradient

This works for me in Chrome

$('#block').css({
    background: "-webkit-gradient(linear, left top, left bottom, from(#ccc), to(#000))" 
});

Also have a look at: http://www.colorzilla.com/gradient-editor/

I'm using the hyphenated syntax in the JSON format (I always use the JSON format to be consistent). And it's working fine in both Chrome and Firefox.

For example:

$("#googleFeed div:even").css({
    'background':'-webkit-linear-gradient(top,white,black)',        
});

Here is a small piece of example...

$("p").css({background:'linear-gradient(red,blue,red)'});

Another option is to use the jQuery addClass method. This allows you to dynamically add and remove classes and therefore any formatting associated with that class including gradients.