Embedding an IFrame

Alright so I am trying to embed an IFrame into an area of a webpage.
To do this, I use XPath to get the node of their bottom bar.
Here is the code I am using:

var helpPanel = document.createElement("iframe");
helpPanel.src = "http://google.com";
helpPanel.setAttribute("id", "helpPanel")
helpPanel.name = "helpPanel";

var allImgs, thisImg;
allImgs=document.evaluate("//img[@id='imgBot']",document,null,XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE,null);
for (var i = 0; i < allImgs.snapshotLength; i++) {
thisImg = allImgs.snapshotItem(i);
alert(thisImg.src);
document.body.insertBefore(helpPanel, allImgs.snapshotItem(i));}

Now the problem I am having is that I get the alert telling me the image source, meaning everything should be a go. However no page appears. I went over to the error console and I got this message "Node was not found" for the last line.

Im quite puzzled because if its displaying that alert, as it is, then the node Should be found, right?

helpPanel has been added to the document, where!!?

Why do you use xpath and cycle?

var img = document.getElementById('imgBot');
img.parentNode.insertBefore(helpPanel, img);

Try the last line with
document.body.parentNode.insertBefore(helpPanel, allImgs.snapshotItem(i));}

Just like gollum said,you have to insert,not only create,helpPanel befor you inert allimgs.