javascript - Why can I access an iFrame but not its contents? -

i'm trying access contents of iframe , i'm getting nowhere.

i have this:

that.findgadget = $.fn.findgadget = function (root) {     var root = root || this;     if (root[0].tagname === "iframe") {        root = root[0].contentdocument || root[0].contentwindow.document;     }     console.log(root);  

};

i'm calling function on iframe so:

// options configuration object id/src/... var newhtml = document.createelement("iframe"); newhtml.setattribute("src", options.src); newhtml.setattribute("frameborder", 0); newhtml.setattribute("data-id", options.id); // add iframe page // options.parent $(element) newparentelement = options.parent.parent()[0]; options.parent.replacewith( newhtml );  // select var newrootelement = newparentelement.queryselectorall(     '[data-id="'+options.id+'"]'   ); // calling on $('iframe') $( newrootelement[0] ).findgadget(); ... 

my if statement inside findgadget works allright, root set document of iframe. i'm stuck there, because else i'm trying:

root.body root.body.innerhtml $(root).find('div'); $('iframe').contents(); 

is undefined or empty selector.

question:
how correctly access elements of iframe? problem contents haven't been loaded? i'm working on localstorage, files same "domain".

thanks help!

right, need wait until iframe content has loaded. using jquery:

$('iframe').load(function () {                             // access iframe content });