Dismiss Bootstrap Popover by Clicking outside

HTML

<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<a href="#">Open Popover</a>
<br/>
<a href="#">Open Popover 2</a>

JavaScript

/***** Create the popover **************/

var options = {
 content: '<h1>Pop Over Content</h1>',
 html: true,
 placement: 'bottom'
};

$('a').popover(options);


/***** Dismiss all popovers by clicking outside, don't dismiss if clicking inside the popover content  **************/

$('html').on('hover', function(e) {
  if (typeof $(e.target).data('original-title') == 'undefined' &&
     !$(e.target).parents().is('.popover.in')) {
    $('[data-original-title]').popover('hide');
  }
});