JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css">
<script src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>
<div class="hide" id="shortcuts"> <a href="javascript:void(0);" id="quickDeleteBtn" class="btn btn-danger">Delete</a>

</div>
<div id="data"></div>

CSS

body {
    padding:100px;
}

JavaScript

$(window).ready(function () {


    var rows = '<table class="table" id="datatable">';
    rows += '<tr>';
    rows += '<td class="popup datarow">This is a test row</td><td class="popup datarow">This is a test row</td>';
    rows += '</tr>';
    rows += '<tr class="popup datarow" rel="popover">';
    rows += '<td>This is another test row</td>';
    rows += '</tr>';
    rows += '</table>';

    $('#data').html(rows);

    $('.popup').popover({
        placement: 'bottom',
        trigger: 'click',
        delay: {
            show: 350,
            hide: 100
        },
        html: true,
        content: $('#shortcuts').html(),
        title: "Quick Tasks"
    });

    });
    



});