title: What's the difference between $(form).submit and $(form).on("submit") in jQuery?
body: <p>I wrote the following code, which doesn't result in an AJAX call in my browser:</p>
  
  <pre><code>$(document).ready(function () {
    $('form').submit(function(event) {
      event.preventDefault();
      var action = $(this).attr('action');
      var data = $(this).serialize();
      $.post(action, data, function(response) {
        $("#die").html(response);
      });
    });
  });
  </code></pre>
  
  <p>However, my instructor live-coded the following code in class, which does work:</p>
  
  <pre><code>$(document).ready(function () {
    $("form").on("submit", function(event) {
      event.preventDefault();
      var action = $(this).attr("action");
      var formData = $(this).serialize();
      $.post(action, formData, function(responseContent) {
        $("#die").html(responseContent);
      });
    });
  });
  </code></pre>
  
  <p>As far as I can tell, the only meaningful difference between my code and his is the use of 'on' vs. 'submit' on line 2.  In fact, on api.jquery.com/submit, the jQuery Foundation states that "This method is a shortcut for .on('submit', handler)...".  Which leaves me confused as to why the two snippets behave differently.</p>