JSFiddle - React, Tailwind, and code Playground

HTML

<div id="dates"></div>
<br>
<div class="pop"><p></p><a  >cancel</a> </div>

CSS

.pink > a { 
    background-color: pink !important;
    background-image:none !important;
}

.green > a { 
    background-color: #ff1000 !important;
    background-image: none !important;
}
.green{position:relative;}
.pop{background-color: #ccc; color:#fff; padding:10px; height:100px; width:300px;border:1px solid #efefef; position:absolute; bottom:20px; display:none; box-shadow:0 5px 600px #dfdfdf ,0 0px 3px #333 inset; }
a { cursor:pointer;}
.dyn{background-color: #ccc; color:#fff; padding:10px; height:50px; width:180px;border:1px solid #efefef; top:10px; position:absolute;  display:block; box-shadow:0 5px 600px #dfdfdf ,0 0px 3px #333 inset; }

JavaScript

$(document).ready(function(){

var Event = function(text, className) {
    this.text = text;
    this.className = className;
};

var events = {};
events[new Date("09/14/2013")] = new Event("Valentines Day", "green");

events[new Date("09/18/2013")] = new Event("Payday", "green");

console.dir(events);

$("#dates").datepicker({
    beforeShowDay: function(date) {
        var event = events[date];
        if (event) {
            return [true, event.className, event.text];
        }
        else {
            return [true, '', ''];
        }
    }
});



$(document.body).on('mouseenter', '.green' ,function(){
  //  alert(1);
    var $myval = $(this).attr('title');
    //alert($myval);
    $(this).append('<div class="dyn"><a href="google.com" target="_blank" ></a><span  >cancel</span></div>');

    
      $('.dyn a').html($myval);
    //$('.pop').show();
    
});
                   //);
                 
           
$(document.body).on('mouseleave', '.green' ,function(){
      
		$(this).children('a').next('div').remove();	
		
		return true;
	});
                 
                 
           
$('.pop a').live('click',function(){
    var $mixtc = $('.pop a').val();
    alert($mixtc);
    $(this).parent().remove();

});


    
    
    
    
});

//$('.pink').hover(function(){
//    var $myval2 = $('.pink').attr('title');
//    alert($myval2);
//});