How to remove $(document).on click event?

Question

Here is the code to add event

   $(document).on({
      click: function() {
        $(this).hide();
        $('#form_name').removeClass('hide');
        $('#form_template_name')
          .attr('placeholder', $(this).text())
          .focus();
      }         
    }, '.form-template-name');

For some conditions i dont want this event to trigger. So what I tried is

$('.form-template-name').off();
$('.form-template-name').unbind();

But nothing seems to work. Did I miss anything ?

Answer 1

You need to pass the event to unbind to .off(), also see the use of namepsaced event names

$(document).on({
    'click.myevent': function () {
        $(this).hide();
        $('#form_name').removeClass('hide');
        $('#form_template_name')
            .attr('placeholder', $(this).text())
            .focus();
    }
}, '.form-template-name');

and

$(document).off('click.myevent', '.form-template-name');

Demo: Fiddle

Answer 2

Try this.

$(document).off('click', '.form-template-name');