JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html>
<head>
    <link href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.2.2/css/bootstrap.min.css" rel="stylesheet">
    <link href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.2.2/css/bootstrap-responsive.min.css" rel="stylesheet">

    <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.2.2/bootstrap.min.js"></script>
</head>
<body>
    <div>
        <svg width="100" height="100">
            <circle r="45" cx="50" cy="50" style="fill: red"/>
        </svg>
    </div>

    <div class="well">
        <p>
        Hover here for a popover.
        </p>
    </div>

    <script type="text/javascript">

        $(document).ready(function() {
            var numCircles = $("circle").length;
            console.log("numCircles = " + numCircles);

            $("circle").popover({trigger:'hover', placement:'bottom', title:'Title!', content:'Content'});

            $("circle").css({"stroke":"blue"});

            $(".well").popover({trigger:'hover', placement:'bottom', title:'Title!', content:'Content'});
        } );
    </script>
</body>
</html>