I'm trying to take the hex value chosen from a jQuery colorpicker plugin, and store it as a cookie using the jQuery cookie plugin.

I just don't know the appropriate way to tie the two together (new to js and jQuery).

Here's my colorpicker function:

    $('#colorSelector').ColorPicker({
color: '#ffffff',
onShow: function (colpkr) {
	$(colpkr).fadeIn(500);
	return false;
},
onHide: function (colpkr) {
	$(colpkr).fadeOut(500);
	return false;
},
onChange: function (hsb, hex, rgb) {
	$('#colorSelector div, .preview-image, .cover ').css('backgroundColor', '#' + hex);
	$('body').css('backgroundColor', '#' + hex);
		$.cookie('bgColor', 'picker');
	return false;
}
});

And here's my cookie function as is:

    var bgColor = $.cookie('bgColor');  

if (bgColor == 'picker') {  
$('#colorSelector div, .preview-image, .cover ').css('backgroundColor', '#' + hex);  
};

I can set and store the cookie value as a standard css background-color, but can't figure out how to pull the "'backgroundColor', '#' + hex" value into the cookie function.