Sample Custom jQuery plugin

1. Download  this folder somewhere you can open and edit the content
2. On $(document).ready , decorateTable custom jQuery plugin is applied on table with id "important" . This will apply even odd classes on the elements of this table . This custom plugin has three input settings parameters $('#important').decorateTable({ oddRow: 'oddAltered', evenRow: 'evenAltered', headerRow: 'headerAltered' });
3. default settings for custom plugin are : oddRow: 'odd',  evenRow: 'even', headerRow: 'header'

altrow.js

"use strict";

$(document).ready(function () {

    $('#important').decorateTable();

    // if you want to give custom colour, give parameteres as mentioned below.

    // $('#important').decorateTable({ oddRow: 'oddAltered', evenRow: 'evenAltered', headerRow: 'headerAltered' });

});

jquery.altrow.js

"use strict";

(function ($) {

    $.fn.decorateTable = function (options) {

        // default settings

        var settings = $.extend({

            oddRow: 'odd',

            evenRow: 'even',

            headerRow: 'header'

        }, options);

        // odd rows not having th element 

        //in table this (on which decorateTable plugin is applied)

        $('tr:not(":has(th)"):odd', this).addClass(settings.evenRow); // class name is swithed to make it look like screenshot in the assignment

        // even rows not having th element

        //in table this (on which decorateTable plugin is applied)

        $('tr:not(":has(th)"):even', this).addClass(settings.oddRow); // class name is swithed to make it look like screenshot in the assignment

        //the row having th element (on which this plugin is applied)

        $('tr:has(th)', this).addClass(settings.headerRow);

    }

}(jQuery));