Jquery click event not firing on previously hidden div

Question

I am loading a \'password-reset-success-message\' div into a \'password-reset\' div dynamically as shown in the below snippet.The \'password-reset-success-message\' div

Answer 1

delegate it to the parent element you are adding the html to

if using jQuery 1.7+ with .on()

$("#password-reset").on('click','#btnPasswordResetOK',function(){

})

with delegate

$("#password-reset").delegate('#btnPasswordResetOK','click',function(){

})

From jQuery docs on which method to use

$(selector).live(events, data, handler); // jQuery 1.3+

$(document).delegate(selector, events, data, handler); // jQuery 1.4.3+

$(document).on(events, selector, data, handler); // jQuery 1.7+

By delegating, you bind the event handler to a static parent element that doesn't change and exists at the time of binding. You specify the element and the events you want to listen to, and when the event bubbles up it will get handled by the static parent element.