Bind custom event to dynamic created elements

I’ve been binding events to dynamically created elements without any kind of issues by using:

$(document).on(event, element, function)

Now I want to bind a custom event and I just can´t get it to work.

The event is a JS plugin to handle single e double click. If I use it like this:

$('#test').oneordoubleclick({
    oneclick: function () {
        alert('you have clicked this node.');
    },
    dblclick: function () {
        alert('you have double clicked this node.');
    }
});

It works like a charm, but, as I transform the code to bind the event to dynamically created elements, like this:

$(document).on('oneordoubleclick', '#test', {
    oneclick: function () {
        alert('you have clicked this node.');
    },
    dblclick: function () {
        alert('you have double clicked this node.');
    }
});

It stops working!

It wasn’t supposed to work? What am i doing wrong? It is possible to do what i want to accomplish?

35 thoughts on “Bind custom event to dynamic created elements”

Leave a Comment