Javascript - Passing object id to function?

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

Code:

---

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

---

in my code I have an area

Code:

---

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

---

And when someone clicks on a image link

Code:

---

<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

Code:

---

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

---

Code:

---

<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)

got it

Code:

---

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

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

---

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

Code:

---

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.
}

---

thanks for the tip