JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://cdnjs.cloudflare.com/ajax/libs/qtip2/2.0.1/basic/jquery.qtip.js"></script>
<script src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>
<span onClick="getTooltip(event)">
Some lines of code
<span>
</p>
<div class="tooltip">
Copied!!!
</div>
CSS
.tooltip {
position: fixed;
padding: 5px;
border: 1px solid #474747;
display: none;
}
JavaScript
function getTooltip(e) {
e.stopPropagation();
var tar = e.target.getBoundingClientRect();
$('.tooltip').css({
top: tar.bottom,
left: tar.y
}).show();
}
$(document).on("click", function(e) {
e.stopPropagation();
$('.tooltip').hide();
});