JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="http://twitter.github.com/bootstrap/assets/js/bootstrap-tooltip.js"></script>
<script src="http://twitter.github.com/bootstrap/assets/js/bootstrap-popover.js"></script>
<!DOCTYPE html> 
<html lang="en"> 
  <head> 
    <meta charset="utf-8"> 
    <title>Pop Over Test</title> 
    <meta name="description" content="Pop Over Test">
  </head>
  <body >

    <div class="container">
      <h1>Pop-Over Test</h1>
      <table>
        <thead>
            <tr>
                <th>first column</th>
                <th>second column</th>
                <th>third column</th>
            <tr>
        </thead>
        <tbody>
            <tr>
                <td><a href="#" class="popover-test" id ="test" rel="popover" 
                data-content="Content 1: this shows fine!" data-original-title="Title 1">Hover for popover</a>
                </td>
                <td>two</td>
                <td>three</td>
            </tr>
            <tr>
                <td><a href="#" class="popover-test" id ="test" rel="popover" 
                data-content="Doesn't show :(" data-original-title="Title 2">Hover for popover</a>
                </td>
                <td>two</td>
                <td>three</td>
            </tr>
            <tr>
                <td><a href="#" class="popover-test" id ="test" rel="popover" 
                data-content="Doesn't show either" data-original-title="Title 3">Hover for popover</a>
                </td>
                <td>two</td>
                <td>three</td>
            </tr>
        </tbody>
    </table>
    </div>
  </body>
</html>

CSS

article,aside,details,figcaption,figure,footer,header,hgroup,nav,section{display:block;}
audio,canvas,video{display:inline-block;*display:inline;*zoom:1;}
audio:not([controls]){display:none;}
html{font-size:100%;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;}
a:focus{outline:thin dotted #333;outline:5px auto -webkit-focus-ring-color;outline-offset:-2px;}
a:hover,a:active{outline:0;}
sub,sup{position:relative;font-size:75%;line-height:0;vertical-align:baseline;}
sup{top:-0.5em;}
sub{bottom:-0.25em;}
img{max-width:100%;height:auto;border:0;-ms-interpolation-mode:bicubic;}
button,input,select,textarea{margin:0;font-size:100%;vertical-align:middle;}
button,input{*overflow:visible;line-height:normal;}
button::-moz-focus-inner,input::-moz-focus-inner{padding:0;border:0;}
button,input[type="button"],input[type="reset"],input[type="submit"]{cursor:pointer;-webkit-appearance:button;}
input[type="search"]{-webkit-appearance:textfield;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;}
input[type="search"]::-webkit-search-decoration,input[type="search"]::-webkit-search-cancel-button{-webkit-appearance:none;}
textarea{overflow:auto;vertical-align:top;}
.clearfix{*zoom:1;}.clearfix:before,.clearfix:after{display:table;content:"";}
.clearfix:after{clear:both;}
body{margin:0;font-family:"Helvetica...

JavaScript

$(function ()
     { $("#test").popover();
  });