JSFiddle - React, Tailwind, and code Playground

HTML

<div id="DialogDetailFact" title="Detail" style="text-align: left; display: none;">
</div>
<table>
    <tr rel="lol1">
        <td>
            Test1
        </td>
    </tr>
    <tr rel="lol2">
        <td>
            Test2
        </td>
    </tr>
    <tr rel="lol3">
        <td>
            Test3
        </td>
    </tr>
</table>

CSS

table
{
    border-collapse: collapse;
}

table tr > *
{
    border: 1px solid Silver;
}

div.DialogDetailFact
{
    position: relative;
}

JavaScript

$("tr").hover(function() {
    $("#dialogDetailFact").html($(this).attr("rel"))
    $("#dialogDetailFact").dialog("open");
}, function() {
    $("#dialogDetailFact").dialog("close");
});