JSFiddle - React, Tailwind, and code Playground

HTML

<input type="button" id="add-row" value="Add row" /><br />

<table id="my-table">
    <tr><td>Row 1</td></tr>
    <tr><td>Row 2</td></tr>
</table>

<div id="detail-popup">
    <iframe>temp</iframe>
</div>

JavaScript

$('#detail-popup').dialog({
    modal: true,
    open: function (event, ui)
    {
        $(this).append('<tr><td height="50" width="50">Answer</td></tr>');
    },
    autoOpen: false,
    title: "Detailed Info",
    resizable: false
});

$('#add-row').click(function() {
   $('#my-table').append('<tr><td>New Row</td></tr>');
});

$('#my-table').on('click', 'tr', function() {
    $('#detail-popup').dialog('open');
});