jQuery Examples - 3 (plugins)

In this blog, I will create an example to demonstrate how custom plugins can be created in jQuery.
Plugins in jQuery are created by using the $.fn object. fn is nothing but the prototype object on jQuery. The following code shows a basic plugin example.


Here, for the purposes of this example I have created a plugin named changeBackColor which changes the background color. This can be easily done by using the css() method but I chose it to demonstrate plugins. The plugin takes an options object which will define all the options for this method. We also provide some defaults. The defaults are defined in this fashion because they give the flexibility to the plugin user to override them, if needed. 
Another plugin example is for calculating averages. This plugin returns a value.