jQuery 'this' scope in event handler

Question

I am unable to access parent object with in the event handler of the object!

I am creating a widget:

(function( $ ) {

  $.widget('cs.window',{

     _create:function(){
       var me = this;
       this.append('<div class="close">X</div>');
       var close = this.element.find('.close');
       close.bind('click',function(){
        alert($(this));// this is referring event handler here
                       //but how to access `me` object here
        me.element.hide();//I want to achieve this, about but its saying me is undefined
      });
     }
  });

}(jQuery));

How to use me object in the click event handler?

Answer 1

If you bind a function with this._on then the this inside the callback is the widget itself. Try:

this._on(close, {
    click: function(){ this.element.hide(); }
});