Do this:
$( '#wrapper' ).on( 'click', 'a', function () { ... });
where #wrapper
is a static element in which you add the dynamic links.
So, you have a wrapper which is hard-coded into the HTML source code:
<div id="wrapper"></div>
and you fill it with dynamic content. The idea is to delegate the events to that wrapper, instead of binding handlers directly on the dynamic elements.
Btw, I recommend Backbone.js – it gives structure to this process:
var YourThing = Backbone.View.extend({
// the static wrapper (the root for event delegation)
el: $( '#wrapper' ),
// event bindings are defined here
events: {
'click a': 'anchorClicked'
},
// your DOM event handlers
anchorClicked: function () {
// handle click event
}
});
new YourThing; // initializing your thing