title: listening in to keypresses and "click outside" for popovers/particular classes
body: <p>I am implementing popovers, since the existing libraries are not flexible enough. I want to set any div with a class <code>.popover</code> and it shows the behaviors:</p>
  
  <ol>
  <li>destroy on escape key</li>
  <li>destroy when clicks outside borders</li>
  </ol>
  
  <p>Both are events, and both need to apply on elements classed as <code>.popover</code>. To destroy popovers on escape:</p>
  
  <pre><code>$(document).keyup(function(e) {
  
    if (e.keyCode == 27) { 
      popovers = $(".popover");
      //destroy popovers
   }
  });
  </code></pre>
  
  <p>But I am stuck with how to listen in to mouse clicks <strong>globally</strong> and determining if they happened outside of a <code>.popover</code>.</p>
  
  <p>SO <a href="https://stackoverflow.com/a/153047/604511">answers</a> mention having a global click listener that destroys all <code>.popover</code>s and adding a click listener to <strong>each</strong> popover that halts event propagation to the global listener.</p>
  
  <p>But I want to define it only once globally, not once for every single popover I make. How do I do that?</p>