iFrame inside another iframe using Jquery

iFrame inside another iframe using Jquery

Hi for all,

In Scenario 1 I have an iframe that is created inside a div and it works well

  1. var tabs = $("#tabs").tabs();
    var divTemplate = '<div id="' + id + '"></div>'
    var ifrTemplate = '<iframe id="ifr-' + uuid + '" src="' + Url + '"></iframe>'
    $(divTemplate).html(ifrTemplate).appendTo(tabs);



In scenario 2 I have an iframe that is created inside another iframe. And all this inside a div, and it also works well.

  1. var tabs = $("#tabs").tabs();
    var divTemplate = '<div id="' + id + '"></div>'
    var bodyTemplate = '<body><iframe id="ifr-sub-' + uuid + '" src="' + Url + '"></iframe></body>';
    tabs.append(divTemplate);
    var iframe = document.createElement('iframe');
    tabs.find("#"+id).append(iframe);
    iframe.id = "ifr-" + uuid;
    iframe.contentWindow.document.open();
    iframe.contentWindow.document.write(bodyTemplate);
    iframe.contentWindow.document.close();









In scenario 3 I would like to do the same thing I did in scenario 2, but would like to use JQuery. For some reason did not work.

  1. var tabs = $("#tabs").tabs();
    var divTemplate = '<div id="' + id + '"></div>'
    var ifrTemplate = '<iframe id="ifr-' + uuid + '"></iframe>'
    var bodyTemplate = '<body><iframe id="ifr-sub-' + uuid + '" src="' + Url + '"></iframe></body>';
    $(divTemplate).html(ifrTemplate).html(bodyTemplate).appendTo(tabs);




What could be wrong?

Regards