javascriptjqueryfunction-binding

Can you unbind a jQuery function that's bound to the document?

I want to prevent this function from working:

$(document).on("click",".filters", function(event) {
    $('.filters').removeClass('selectedFilter');
    $(this).addClass('selectedFilter');
    $('.filters div').not('.selectedFilter div').slideUp(200);
    $('.selectedFilter div').animate({opacity:"toggle",height:"toggle"},200);
});

I've tried $(".filters").unbind("click"), but that's not working, I'm guessing because of how I trigger it in the first place?

Solution

  • Try off instead of unbind

    $(document).off("click", ".filters");

    From the documentation:

    The .off() method removes event handlers that were attached with .on() and Event handlers attached with .bind() can be removed with .unbind()