Tutorials › jQuery in Practice › Plugins

Plugins

6 min read

Create plugins with $.fn.myPlugin = function(){ return this.each(fn); }. Always return this for chainability. Accept an options object merged with $.extend({}, defaults, userOptions) for flexible configuration.

Writing a jQuery Plugin

$.fn.highlight = function(color) {
  color = color || 'yellow';
  return this.each(function() {
    $(this).css('background', color);
  });
};

// Usage
$('p').highlight();
$('h2').highlight('#cce');

Always return this so the plugin supports chaining.

← Filter and Map Next: Utility Functions →

Quick Access

Plugins

Writing a jQuery Plugin