javascript - jquery - on submit form before form is rendered -

i using code:

$(document).ready(function () { $("#step1_next").validate({     submithandler: function(form) {         $.post('step2.php', $("#step1_next").serialize(), function(data) {             $('#step2_div').html(data);               $("#step2_form").on("submit", function() {                  $.post('../model/step2.php', $("#step2_form").serialize(), function(data) {                     $('#step2_controller').html(data);                 });                  return false;              });           });     } }); }); 

basically, wanted when step2.php rendered, ajax function attached onto step2_form (inside step2.php).

this code doesn't work because "step2_form" isn't loaded yet. can do?

use event delegation using .on()

$(document).ready(function () {     $("#step1_next").validate({         submithandler: function(form) {             $.post('step2.php', $("#step1_next").serialize(), function(data) {                 $('#step2_div').html(data);                   $(document).on("submit", "#step2_form", function() {                      $.post('../model/step2.php', $("#step2_form").serialize(), function(data) {                         $('#step2_controller').html(data);                     });                      return false;                  });               });         }     }); });