jquery - Trigger a custom event on a dynamic element -

i created custom login.validate event , binded .question dynamic element. not able trigger new event using trigger method (). here js fiddle , script http://jsfiddle.net/pzsym/400/

<h2></h2> <button>generate new element</button> <p class="generateevent">trigger event validate</p>   $("button").click(function() {     $("h2").html("<p class='test'>click me</p>") });   $('p.test').bind('validate', function(){      alert('this working'); })  $('h2').on('login.validate', 'p.test', function(){     console.log('good validate event need trigered'); });  $('.generateevent').click(function(){     $('p.test').trigger('login.validate');  }); 

how trigger custom event in dynamic elements?

you need use event delegates. here working sample:

http://jsfiddle.net/tkirda/pzsym/414/

$("button").click(function () {     $("h2").html("<p class='test'>click me</p>") });   $(document).on('validate', 'p.test', function () {     alert('this working'); })  $('h2').on('login.validate', 'p.test', function () {     console.log('good validate event need trigered'); });  $('.generateevent').on('click', function () {     $('p.test').trigger('validate'); });