JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
<a href="#item-1-1">
  Menu Choice 1 
  <img src="http://www.freeiconspng.com/uploads/info-icon-23.png" width=20 height=20 data-toggle="popover" data-content="Popover1" />
</a><br/>
<a href="#item-1-2">
  Menu Choice 2 
  <img src="http://www.freeiconspng.com/uploads/info-icon-23.png" width=20 height=20 data-toggle="popover" data-content="Popover2" />
</a><br/>
<a href="#item-1-3">
  Menu Choice 3 
  <img src="http://www.freeiconspng.com/uploads/info-icon-23.png" width=20 height=20 data-toggle="popover" data-content="Popover3" />
</a><br/>

CSS

a.list-group-item.menuitem {
	background: #24244a;
	color: #fff;
	padding-left: 65px;
	font-family: helvetica, arial sans-serif;
	font-size: .83em;
}

JavaScript

// Trigger Bootstrap Popover on all Activity Menus
	$('[data-toggle="popover"]').popover();
  
 $('body').on('click', function (e) {
    //only buttons
    if ($(e.target).data('toggle') !== 'popover'
        && $(e.target).parents('.popover.in').length === 0) { 
        $('[data-toggle="popover"]').popover('hide');
    }
  });