title: AjaxSubmit is not a function on DOM reload
body: <p>I have this code below.</p>
  
  <pre><code>$('body').on('submit', '.some-form', function (event) {
      $(this).ajaxSubmit({
          dataType: 'json',
          success: function (data, statusText, xhr, form) {
              var url = 'some/url';
  
              // Reload the form markup/DOM using the response
              $.ajax({
                  dataType: 'html',
                  type: 'get',
                  url: url
              }).done(function (html) {
                  // get markup from url and replace the form markup ...    
              });
          },
          error: function () {
              alert('error');
          }
      });
  
      return false; 
  });
  </code></pre>
  
  <p>Essentially what I am doing here is</p>
  
  <ol>
  <li>submit and process the form</li>
  <li>get the results</li>
  <li>if success, get new form markup from a page then replace the current form markup.
  if failure, show error</li>
  </ol>
  
  <p>Now, because I delegated the submit event to the body, there shouldn't be a problem with
  handling the submit on the newly loaded form markup. </p>
  
  <p>The function handler works fine until I see this error</p>
  
  <pre><code>TypeError: $(...).ajaxSubmit is not a function
  
  error: function () {
  </code></pre>
  
  <p>Any idea why this happened? It implies that ajaxSubmit does not exist but I did not reload
  the page.</p>
  
  <p>EDIT: Yes, I am using the <a href="http://malsup.com/jquery/form/" rel="nofollow">jquery form plugin</a></p>