Bootstrap Popover with HTML

HTML

<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<div class="container">
   <h3>Popover Example</h3>
   <a href="#" data-toggle="popover" title="Popover Header" data-placement="bottom">Toggle popover</a>
   <div id="popover-content" style="display:none;">
     <ul>
         <li> Info 1 </li>
         <li> Info 2 </li>
         <li> Info 3 </li>
     </ul>
   </div>   
</div>

CSS

.container {padding:20px;}
.form-control {width:120px;}
.popover {max-width:400px;}

JavaScript

$("[data-toggle=popover]").popover({
    html: true, 
	  content: function() {
          return $('#popover-content').html();
        }
});