title: Why jQuery triggerHandler() works but trigger() doesn't?
body: <p>Click an element using <a href="http://api.jquery.com/triggerHandler" rel="nofollow noreferrer"><code>triggerHandler()</code></a> works:</p>
  
  <pre><code>$element = $('#gwt-debug-location-pill-edit-div:visible');
  $element.triggerHandler('click');
  </code></pre>
  
  <p>But, clicking it using <a href="http://api.jquery.com/trigger" rel="nofollow noreferrer"><code>trigger()</code></a>, doesn't:</p>
  
  <pre><code>$element.trigger('click');
  </code></pre>
  
  <p>Why is that?</p>
  
  <hr>
  
  <p>To replicate this (in Firefox and Chrome):</p>
  
  <ul>
  <li>Go to <a href="https://adwords.google.com/select/home" rel="nofollow noreferrer">https://adwords.google.com/select/home</a>, and log in using your credentials</li>
  <li>Tools and Analysis <code>-&gt;</code> Keyword Planner</li>
  <li>Expand "Enter or upload keywords to see how they perform"</li>
  <li>Using browser's console, try to click on the locations box (marked in red in the screenshot below) via the two methods above (you'll need to inject jQuery into the page. I used <a href="http://www.learningjquery.com/2006/12/jquerify-bookmarklet" rel="nofollow noreferrer">jQuerify</a> to do that.)</li>
  </ul>
  
  <hr>
  
  <p><img src="https://i.stack.imgur.com/gVB9L.jpg" alt="enter image description here"></p>