Where should I add style in jQuery plugin elements?

Question

Is it considered good practice to add style to the elements generated by a jQuery plugin in the script itself, or an external stylesheet?

(function($) {
    $.myplugin= function(options) {
     var options = jQuery.extend({
      backgroundColor: '#0066cc',
      borderColor: '#003366',
      borderWidth: '1px',
      fontColor: '#66ccff'
      // etc...
     }, options);
     var html = '<div id="__plugin">...</div>';
     var $plugin= $(html).css({
                            'color': options.fontColor,
                            'background-color': options.backgroundColor
                            'border-color': options.borderColor,
                            'border-width': options.borderWidth,
                            'display': 'none'
                            // etc...                                
                        });      
     return $plugin.appendTo(document.body);
    };
})(jQuery);

Should I take the approach above and let users of the plugin pass in parameters to customize the style, or should I eliminate the style elements and use an external stylesheet?

My gut reaction tells me I should use the latter, but I'm curious what the standard practice is, or if there even is one?

Answer 1

You shouldn't really include styles in your pluggins if you can help it. Best thing to do is to expose your html as parameters for your plugin. See this article on the matter:

http://www.learningjquery.com/2009/03/making-a-jquery-plugin-truly-customizable

James Padolsey is spot on!