JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
<ul>
    <li><a href="#" id="example1" rel="popover" data-placement="bottom" data-original-title="">Blundell's Volkswagen</a>

    </li>
</ul>
<div id="retailer-bdm-popover" style="display: none">
    <div class="panel panel-default">
        <div class="panel-heading"><strong>Retailer</strong>

        </div>
        <div class="panel-body"> 
            <strong>Andrew Cooper</strong>

            <br/> <strong>Blundell's Volkswagen</strong>

            <br/> <strong>Tel:</strong>&nbsp;01234 567890
            <br /> <a href="[email protected]">[email protected]</a>
        </div>
    </div>
    <div class="panel panel-default">
        <div class="panel-heading"><strong>BDM</strong>

        </div>
        <div class="panel-body"> <strong>Kristina Handelsen</strong>
            <p>
            <br/> <strong>South East Area</strong>

            <br/> <strong>Tel:</strong>&nbsp;01798 086579
            <br /> <a href="[email protected]">[email protected]</a>
            </p>
        </div>
    </div>
</div>

CSS

body {
    padding: 20px;
    padding-left: 100px;
}
.nowrap {
    white-space: nowrap;
}

.popover {
    max-width:none;
}

JavaScript

$(function () {
    $('[rel=popover]').popover({
        html: true,
        content: function () {
            return $('#retailer-bdm-popover').html();
        }
    });
});