title: Popper.js: How to close popup when clicking outside
body: <p>I'm using <a href="https://popper.js.org/" rel="noreferrer">Popper.js</a> to show a popup elment having the class <code>.js-share-cf-popover</code>  when clicking elements with class <code>.js-share-cf-btn</code>.</p>
  
  <p>But I want the popup to close only when I click outside of it. Here my actual code that show the popup:</p>
  
  <pre><code>var reference = $('.js-share-cf-btn');
  var popover = $('.js-share-cf-popover');
  popover.hide();
  
  $(document).on('click', reference, function(e) {
    e.preventDefault();
  
    popover.show();
  
    var popper = new Popper(reference, popover, {
      placement: 'top',
    });
  });
  </code></pre>
  
  <p>I found something <a href="https://github.com/FezVrasta/popper.js/issues/300" rel="noreferrer">here</a> but I can't get it works</p>
  
  <p>Here My <a href="https://jsfiddle.net/xpvt214o/42053/" rel="noreferrer">jsfiddle</a></p>