gistfile1.js

(function ($) {

    $.widget('rf.orderingList', {

        options: {
            disabled: false,
            color: 'red'
        },

        _create: function () {
            $.proxy(this._addClickListener(), this);
            $(this.element).addClass('orderingList');
        },

        _init: function () {
            $.proxy(this.reset, this);
        },

        _selectItem: function(item) {
            $(item.addClass('red'));
        }
        ,
        _addClickListener: function() {
            $(this.element).bind('click.orderingList', function (event) {
                $(event.target).css('background-color', 'red');
            })
        },

        reset: function() {
            $(this.element).removeClass('orderingList');
            $('li', this.element).css('background-color', '');
        },

        _setOption: function(key, value) {
            if (this.options[key] === value) {
                return this; // Do nothing, the value didn't change
            }

            switch (key){
                case "disabled":
                    $.proxy(this.reset(), this);
                    $.Widget.prototype.disable.call(this);
                    break;
                default:
                    this.options[key] = value;
            }
        },

        destroy: function() {
            $(this.element).unbind('click.orderingList');
            $.proxy(this.reset(), this);
            $(this.element).removeClass('orderingList');
            $.Widget.prototype.destroy.call(this);
        }
    });

}(jQuery));