JSFiddle - React, Tailwind, and code Playground

HTML

<form>
<input type="button" onclick="doit('L');" value="B1" />
<input type="button" onclick="doit('R');" value="B2" />
</form>
<div id="divOrgParent" style="width:200px;height200px;"><div id="div1" style="width:200px;height:200px;">Org</div></div>

JavaScript

function doit(criteria1) {
    $('#div1').dialog("destroy");

    if (criteria1 == "L") {
        $("#div1").html("<iframe id='dialogFrame1' src='http://news.ycombinator.com' Height='100%' Width='100%' frameborder='0'></iframe>");
    }
    else {
        $("#div1").html("<iframe id='dialogFrame2' src='http://jsfiddle.net' Height='100%' Width='100%' frameborder='0'></iframe>");
    }

    $('#div1').dialog({

        height: 220,
        title: "Title",
        width: 500,
        modal: true,
        beforeclose: function(event, ui) {

            $("#div1").html("");
            $("#div1")[0].innerHTML = "";
        }

    });
    //console.dir($("#div1").parent());
    //$('#div1').parent().appendTo($("form:first"));
    //console.dir($("#divOrgParent"));
    $('#div1').dialog('open');
}