JSFiddle - React, Tailwind, and code Playground

by RoryMcCrossan

CSS

iframe {
  overflow: hidden;
  overflow-x: hidden;
  overflow-y: hidden;
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  /* display: none; */
}

JavaScript

$("body").append(renderIframe());

function renderIframe() {
  return '<div id="mydiv"><iframe id="frame"></iframe></div>';
}

var iFrame = $('#frame');
let data = '<p>Lorem ipsum</p><button id="btnClose">Close</button>';
var iFrameDoc = iFrame[0].contentDocument || iFrame[0].contentWindow.document;
iFrameDoc.body.innerHTML = data;

$('#frame').contents().find('body').on('click', '#btnClose', function(e) {
  e.preventDefault(e);
  alert("link clicked!");
});