JSFiddle - React, Tailwind, and code Playground

by adrianhdezm

HTML

<script src="http://twitter.github.io/bootstrap/assets/js/bootstrap.js"></script>
<link rel="stylesheet" href="http://twitter.github.io/bootstrap/assets/css/bootstrap.css">

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
	<title>untitled</title>
	<meta http-equiv="content-type" content="text/html;charset=utf-8" />
	<meta name="generator" content="Geany 0.21" />
	<link href="css/bootstrap.css" rel="stylesheet">
    <link href="css/bootstrap-responsive.css" rel="stylesheet">
	
	<script>
		function myFunction(item, name, actStatus, openTasks, schMeetings)	{
			
			$(".popover").each(function() {
				$(this).remove();
			});
			
			item.popover({
				 placement:'bottom',
				 html:true,
				 trigger: 'manual',
				 title: name + '<button type="button" class="close" aria-hidden="true">&times;</button>',
				 content:"Status:" + actStatus + "<br/> Open Tasks:"+openTasks +"<br/> Scheduled Meetings:"+schMeetings ,
				 template:'<div class="popover"><div class="arrow"></div><div class="popover-inner"><h3 class="popover-title"></h3><div class="popover-content"></div></div></div>'  		 
				 });
			
			item.popover('show'); 
			
			$("button.close").on("click", function(){
				$(this).closest(".popover").remove();
			});
		}
	</script>
	
</head>
<body>
	<div>Click the button to trigger a function. <button onclick="myFunction($(this).parent(), 'act_name1', 'open', '1.9', '3.0')">Click me</button></div>
	
	
	<div>Click the button to trigger a function. <button onclick="myFunction($(this).parent(), 'act_name2', 'open', '1.9', '3.0')">Click me</button></div>
	<script src="js/jquery.js"></script>
    <script src="js/bootstrap.js"></script>
	
</body>

</html>