JSFiddle - React, Tailwind, and code Playground

HTML

<div>
  <div id="wrap1">
    <div>
      <iframe id="iframe1"></iframe>
    </div>
  </div>
  <div id="wrap2">
    <div>
      <iframe id="iframe2"></iframe>
    </div>
  </div>
</div>
<a href="#">Move iFrame!</a>

CSS

#iframe1, #iframe2{width:200px;height:100px}

JavaScript

$(function(){
   $("#iframe1")[0].contentWindow.document.body.innerHTML = "<div>Hello</div>";
    $("#iframe1")[0].contentWindow.test = "YES";
    $("a").click(function(e){
        e.preventDefault();
        var w2 = $('#wrap2')[0];
        $('#wrap1').parent()[0].appendChild(w2);
        console.log($("#iframe1")[0].contentWindow.test);
    });
});