JSFiddle - React, Tailwind, and code Playground

by giorgitbs

HTML

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
<div class="popover-markup">
  <a href="#" class="trigger">
    This link triggers the popover.
  </a>
  <div class="head hide">
    This is the popover title.
   </div>
  <div class="content hide">
    <p>This is the popover content.</p>
  </div>
</div>

JavaScript

/* The easiest way to add popovers to your HTML prototypes
   ========================================================================== */

$('.popover-markup > .trigger').popover({
    html : true,
    title: function() {
      return $(this).parent().find('.head').html();
    },
    content: function() {
      return $(this).parent().find('.content').html();
    },
    container: 'body',
    placement: 'bottom'
});