JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://twitter.github.com/bootstrap/1.4.0/bootstrap-twipsy.js"></script>
<script src="http://twitter.github.com/bootstrap/1.4.0/bootstrap-popover.js"></script>
<link rel="stylesheet" href="http://twitter.github.com/bootstrap/1.4.0/bootstrap.min.css">
<div class="test"></div>
<p>
<a href="#" id="blob1" class="btn large primary" rel="popover" data-content="And heres some amazing content. Its very engaging. right?" data-original-title="A title">hover for popover</a>

CSS

#blob1 {position: absolute; top: 200px; left: 100px;}
#blob {position: absolute; top: 100px; left: 100px;}

JavaScript

$("#blob").popover({offset: 10});
$("#blob1").popover({offset: 10});

$('.test').append('<a href="#" id="blob" class="btn large primary" rel="popover" data-content="And heres some amazing content. Its very engaging. right?" data-original-title="A title">hover for popover with append</a>');

$("#blob").popover({offset: 10});