jquery-plugins Getting started with jquery-plugins Typical jQuery Plugin Structure

Example

While writing jQuery plugins is simple, we want to enclose our plugins in a local scope. This will avoid namespace conflicts as well as polluting the global namespace, on top of ensuring that jQuery is loaded before our plugin extends it.

// Encapsulate our plugins in a local scope
(function($) {

    // Plugin definition
    $.fn.colourize = function() {

        // Plugin code

    };

// Pass the jQuery object into our local scope
}(jQuery));

The local scope wrapper may be omitted on other examples to keep them simple and concise.