title: Initialize jQuery validate() function on multiple dynamically added forms
body: <p>It is has been suggested that it is best to initialize a <code>$('#form').validate({})</code> function on page load rather than on a click event: <a href="https://stackoverflow.com/questions/10984196/jquery-form-validate-plugin-only-allow-submit-if-input-is-changed">jquery.form/validate plugin only allow submit if input is changed</a></p>
  
  <p>I'm wondering how to do this for multiple dynamically added forms without wrapping the <code>$('#form').validate({})</code> function inside of a <code>on('click', 'input[type="submit"]',</code> function.</p>
  
  <p>Take this code for example: </p>
  
  <pre><code>var id="some identifier for the specific form that is submitted";
  `$('#form'+id).validate({})`
  </code></pre>
  
  <ol>
  <li>How does this unique identifier, <code>id</code>, which is required to distinguish each form get created in the first place?</li>
  <li>And what if you don't know the <code>id</code> after the page is loaded because it has been created dynamically, e.g., by AJAX.</li>
  </ol>
  
  <p>I have been doing this but this is is what's <strong>not</strong> recommended: </p>
  
  <pre><code>$(document.body).on('click', 'input[type="submit"]', function(){
    var id=this.id;
    $('#form'+id).validate({});
  });
  </code></pre>
  
  <p>thoughts?</p>
  
  <p>thanks,
  tim</p>