jQuery Nesting Events

Question

Sometimes in my jQuery scripts they don't work unless I nest the events. For example...

$(selector).click(function(){
    //do something such as create an element
    $(selector).click(function(){
     //do something with the created element
    });
});

Is this ok? I've always tried to avoid it as it doesn't seem the proper way of doing things. However sometimes it just doesn't work so I have to.

Answer 1

The only case in which you should be nesting is if you are re-assigning the click behavior after the initial click. I'm not sure if you're looking to chain, eg

$('el')
.click(function(){})
.hover(function(){})

It depends on what you're doing, entirely.

Answer 2

If you want to apply any events to an element you have to do that after the elements has been created.

A jQuery statement that sets an event on elements naturally can only set it on elements that exist at that time. Any element that you create after the statement will not magically get the events that you set on the elements before.

So, if you create an element in an event and want to assign an event to it, you have to do that also in the event.