JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<table id="pricing_table" summary="Pricing options compared">
	<colgroup><col>
	</colgroup>
	<thead>
	<tr>
	<th scope="col" width="30%"></th>
	<th scope="col" width="25%">Free</th>
	<th scope="col" width="25%">1 Month</th>
	<th scope="col" width="30%">Subscription<br />(Monthly)</th>
	</tr>
	</thead>
	<tbody>
        <tr style="height:30px" id="row" desc="Something very cool! <a href='#test'>Click here</a> to see it in action. <br /> Extra text to fill more space, blah blah blah blah blah blah blah.">
	<td>Feature 1</td>
	<td class="y">&#10004;</td>
	<td class="y">&#10004;</td>
	<td class="y">&#10004;</td>
	</tr>
                <tr style="height:30px" id="row" desc="mofm miao moaimoimosdf miomfsd oimiomflkmal lkmlkm fmakfsdfjsafj jajjjsdjfasdjf laksdfalk mflaksmdflaskmflasd mkaldmfsldkfjoerijwoeirmokfm lkmsflkasdjflkasdfmaksldflaskdfmaslfnaslkfnaslfkj klasnfjasdnflkasdfnalsdkfjaklfnn nnjnlkj">
	<td>Feature 2</td>
	<td class="y">&#10004;</td>
	<td class="y">&#10004;</td>
	<td class="y">&#10004;</td>
	</tr>
    </tbody>
</table>
    <div id="divOverlay"><div class="content"></div></div>

CSS

#divOverlay { 
	display: none; 
	text-align:center;  
	position:absolute; 
	z-index:10000; 
	opacity:1; 
	font: italic 12px Arial, Helvetica, sans-serif;
	} 
#divOverlay .content{
    display:table-cell;
    vertical-align:middle;
}

JavaScript

$(document).ready(function() {
    $('#row').mouseover(function() {
        var $divOverlay = $('#divOverlay');
        var bottomWidth = $(this).css('width');
        var bottomHeight = $(this).css('height');
        var rowPos = $(this).position();
        bottomTop = rowPos.top;
        bottomLeft = rowPos.left;
        $divOverlay.css({
            position: 'absolute',
            display: 'table',
            top: bottomTop,
            left: bottomLeft,
            width: bottomWidth,
            height: bottomHeight
        });	
        $divOverlay.find(".content").html($(this).closest('tr').attr('desc'));
        $divOverlay.delay('100').fadeIn();
        $(this).closest('tr').css({ opacity: 0.01 });

    });
    $('#divOverlay').mouseleave(function() {
        var $divOverlay = $('#divOverlay');
		$("#row").css({ opacity: 1 });
        $divOverlay.fadeOut();
    });
});