JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.1/js/bootstrap-select.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.1/css/bootstrap-select.min.css">
<a href="#" id="popover">the popover link</a>

<br>

<div id="popover-head" class="hide">
  some title
</div>

<div id="popover-content" class="hide">
	<!-- MyForm -->
	<select class="selectpicker" data-live-search="true">
	  <option data-tokens="ketchup mustard">Hot Dog, Fries and a Soda</option>
	  <option data-tokens="mustard">Burger, Shake and a Smile</option>
	  <option data-tokens="frosting">Sugar, Spice and all things nice</option>
	</select>
</div>

JavaScript

$('#popover').popover({ 
	    html : true,
	    title: function() {
	      	return $("#popover-head").html();
	    },
	    content: function() {
		 	return $("#popover-content").html();      
	    }
	});