JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<div class="container">
    <h3>Exemplo de <i>popover</i> com elementos HTML</h3>
    <a href="javascript:;" data-toggle="popover">
        <span>Popover</span>
    </a>

    <div id="popover-table" class="hide">
        <table class="table table-bordered">
            <caption>Monthly savings</caption>
            <tr>
                <th>Month</th>
                <th>Savings</th>
            </tr>
            <tr>
                <td>January</td>
                <td>$100</td>
            </tr>
            <tr>
                 <td>February</td>
                 <td>$50</td>
             </tr>
        </table>
    </div>
    
</div>

JavaScript

$('[data-toggle=popover]').popover({
   content: $('#popover-table').html(),
   html: true,
   trigger: 'hover'
});