Jquery off not removing event handler in Ember application

I am not able to remove a event handler from the ember application by using off.

my handler function is

setClickEvent: function(){
  var panel = this.$();
  if(panel && panel.find(event.target).length === 0 && this.get('isOpen')){
    this.send('cancel');
  }
}

and I am calling this function in didInsertElement function using the below code

didInsertElement: function(){
  Ember.$('body').on('click', Ember.run.bind(this, this.setClickEvent));
}

and calling the off in willDestroyElement function as below

willDestroyElement: function(){
  Ember.$('body').off('click', this.setClickEvent);
  this._super();
}

I tried to go through many stackoverflow questions related to it. Which suggested to place an empty on after the off, I tried it but it didn't work.

The problem is that whenever I am moving away from the page and coming back I am finding two handlers handling the same event, because the previous event handler has not got removed and the event handlers are getting stacked up.