title: Bootstrap Modal buttons do not respond to click
body: <p>I am having a mare with Bootstraps buttons in a modal popover.  Whatever I do I cannot get the click event to fire. Latest Bootstrap, jQuery 1.7.1.</p>
  
  <p>Inside the modal I have a footer with buttons</p>
  
  <pre><code>&lt;div class="modal-footer"&gt;
    &lt;a href="#" class="btn cancelBtn"&gt;Cancel&lt;/a&gt;
    &lt;a href="#" class="btn dontSaveBtn"&gt;Don't Save&lt;/a&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>And my JS that is not working (click is never fired)</p>
  
  <pre><code>$("#navigate-away .cancelBtn").on("click", function(event){
    console.log('Click.');
    $('#navigate-away').modal('hide');
  });
  </code></pre>
  
  <p>I can prove it works by using hover instead of click (hover fires ok)</p>
  
  <pre><code>$("#navigate-away .cancelBtn").on("hover", function(event){
    console.log('Click.');
    $('#navigate-away').modal('hide');
  });
  </code></pre>
  
  <p>It seems the click event is being swallowed internally? I see all over SO people using this exact method with no problems.  What simple thing am I missing?</p>