Javascript - Passing object id to function?

[Graff]

I have a function that loads an html file into an iframe

function LoadIFrame(file) {
	ContentWindow.innerHTML = "<iframe width=455 height=446 src='" + file + ".htm' frameborder='0'></iframe>";
}

in my code I have an area

<div id="ContentWindow"></div>

And when someone clicks on a image link

<a href="#"><img src="images/News.jpg" id="News" onClick="LoadIFrame('News');window.focus();"></a>

Now all this works just as I expect. But what I want to is to have more than one IFrame that can be loaded so I want to be able to pass in which area the iframe should be loaded

function LoadIFrame(file,frame) {
	frame.innerHTML = "<iframe width=455 height=446 src='" + file + ".htm' frameborder='0'></iframe>";
}

<a href="#"><img src="images/News.jpg" id="News" onClick="LoadIFrame('News','ContentWindow');window.focus();"></a>

However when I try this it no longer works. I'm fairly new to Javascript, so is there some I can do so I can pass in the ID to make this possible or would I have to make some sort of if else statement (although that would be undesirable since I would like to make this as flexible as possible and work with any site I'm working on)

[Graff]

got it

function LoadIFrame(file, frameid) {
	var divElement = document.getElementById(frameid);

	divElement.innerHTML = "<iframe width=455 height=446 src='" + file + ".htm' frameborder='0'></iframe>";
}

[CornedBee]

Even better would be rmoving the div, having the iframe all the time and setting the src property via JavaScript.

function LoadIFrame(id, src)
{
  var frame = document.getElementById(id);

  if(frame)
    frame.src = src;  // better DOM would be
     // frame.setAttribute("src", src);
     // but there's insufficient browser support for that.
}

[Graff]

thanks for the tip