title: How do I make javascript function dependant on successful form submission?
body: <p>I've tried to modify <a href="https://stackoverflow.com/a/18086670/8682821">this</a> post but for some reason it's not working, I'm quite new to JS so I could be missing something in the code I just can't tell where.</p>
  
  <p>I'm building a 3 stage process out of tabs, the tabs are:</p>
  
  <ul>
  <li>contact form;</li>
  <li>tab 2;</li>
  <li>tab 3;</li>
  </ul>
  
  <p>I don't want the user to have to click 'Submit' on the form and then a separate 'Continue' button to go to the second tab, so I'm looking to apply a Javascript query/callback to the form submission button that links to the second tab <strong>but only if the form has been submitted successfully</strong>.
  <br></p>
  
  <p>This is my existing Javascript:</p>
  
  <pre><code>&lt;script&gt;
  jQuery(document).ready(function() {
    jQuery(".dhvc-form-submit").submit(function() {
  
      jQuery.ajax({
       type: "POST",
        url: "form_handler.php",
        data: jQuery(this).serialize(),
        success: function() {
          window.location = '#an_76234532'; });
         }
      })
  
    })
  })
  &lt;/script&gt;
  </code></pre>
  
  <p>Currently this isn't triggering anything.</p>
  
  <p>The submit button's class is <code>.dhvc-form-submit</code>, </p>
  
  <p><a href="https://i.stack.imgur.com/uLgTD.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/uLgTD.png" alt="View Image"></a></p>
  
  <p>The second tab has the href ID <code>#an_76234532</code>.</p>
  
  <p><br>
  Have I missed something and if not how can I achieve this functionality?</p>