JSFiddle - React, Tailwind, and code Playground

by Devendra Mani

HTML

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="http://montrezorro.github.io/bootstrap-checkbox/javascripts/bootstrap-checkbox/css/bootstrap-checkbox.css">
<script src="http://montrezorro.github.io/bootstrap-checkbox/javascripts/bootstrap-checkbox/js/bootstrap-checkbox.js"></script>
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/font-awesome/3.0.2/css/font-awesome.css">
<div id="popover-cnt-detect" class="show">
     <ul class="detectul">
         <li class="listitems"> <div class="checkbox"><label><input name="check[]" type="checkbox" class="checkbox" value="Frontal">&nbsp;Frontal Face</label></div></li>
         <li class="listitems"> <div class="checkbox"><label><input name="check[]" type="checkbox" class="checkbox" value="Profile"> &nbsp;Profile Face</label></div></li>
         <li class="listitems"> <div class="checkbox"><label><input name="check[]" type="checkbox" class="checkbox" value="Eyes">&nbsp;Eyes</label> </div></li>
         <li class="listitems"> <div class="checkbox"><label><input name="check[]" type="checkbox" class="checkbox" value="Head">&nbsp;Head</label></div></li>
     </ul>
     <button type="submit" class="btn alert-continue-btn ">Continue</button>
 </div>

JavaScript

$("#detect").popover({
        html: true, 
        content: function() { return $('#popover-cnt-detect').html(); }
    });
    $("#detect").click(function()
    {
    $(this).popover({
            html: true, 
            trigger: 'click',
            content: function() { return $('#popover-cnt-detect').html(); }
        });

    return false;
    });