title: Jquery ajax call click event submit button
body: <p>I've built an ajax call that's submitted when a user clicks the submit button.  I've included jquery and wrote the following code (taken from the jquery documentation):</p>
  <pre><code>&lt;script src=&quot;http://code.jquery.com/jquery-1.11.0.min.js&quot;&gt;&lt;/script&gt;
  &lt;script&gt;
  $(document).ready(function(){
    $(&quot;Shareitem&quot;).click(function(e){
        e.preventDefault();
      $.ajax({type: &quot;POST&quot;,
              url: &quot;/imball-reagens/public/shareitem&quot;,
              data: { id: $(&quot;Shareitem&quot;).val(), access_token: $(&quot;access_token&quot;).val() },
              success:function(result){
        $(&quot;sharelink&quot;).html(result);
      }});
    });
  });
  &lt;/script&gt;
  </code></pre>
  <p>Html:</p>
  <pre><code>&lt;div id=&quot;sharelink&quot;&gt;&lt;/div&gt;
  [...]
  &lt;input type=&quot;hidden&quot; name=&quot;id&quot; value=&quot;&quot; id=&quot;id&quot;&gt;&lt;/dd&gt;
  &lt;dd id=&quot;access_token-element&quot;&gt;
  &lt;input type=&quot;hidden&quot; name=&quot;access_token&quot; value=&quot;xxxxxxxx&quot; id=&quot;access_token&quot;&gt;&lt;/dd&gt;
  &lt;dt id=&quot;Shareitem-label&quot;&gt;&amp;#160;&lt;/dt&gt;&lt;dd id=&quot;Shareitem-element&quot;&gt;
  &lt;input type=&quot;submit&quot; name=&quot;Shareitem&quot; id=&quot;Shareitem&quot; value=&quot;UpdatedByPreviousAjaxCall&quot;&gt;&lt;/dd&gt;&lt;/dl&gt;&lt;/form&gt;
  </code></pre>
  <p>The problem is, the submit action is executed but the ajax call is not, so the form is performing the requested submit action instead of staying on the same page and updating the content of the <code>div</code> tag.</p>
  <p>What am I missing? Where am I wrong?
  Thanks in advance for any tips.</p>