JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://dimweb.se/annat/twbs/js/bootstrap.js"></script>
<link rel="stylesheet" href="http://dimweb.se/annat/twbs/css/bootstrap.css">
<div class="container">
    <span class="content">Hover me. I dare you.</span><br />
    <button>Change contents.</button>
</div>

CSS

div.container {
    padding: 50px;
}

span.content {
    display: inline-block;
    margin-bottom: 30px;
}

JavaScript

$(".content").popover({
    trigger: "hover",
    placement: "right",
    title: "First title.",
    content: "First content."
});

$("button").on("click", function(e) {
    e.preventDefault();
    var content = $(".content");
    content.popover("destroy").popover({
        trigger: "hover",
        placement: "right",
        title: "Second title.",
        content: "Second content."
    });
    $(this).text("Now hover it again.");
});