Why does my image not show up when I use Javascript innerHTML to call it?

Question

I am pretty new to Javascript, and I was trying somethings out. I am using a function to load an image inside a table using innerHTML. But the image does not show up, unless

Answer 1

you aren't adding the image src. and it should be href='#'it should be like this

function show(){
     document.getElementById('imageHolder1').innerHTML="<a href='#'><img src='photos/picture.jpg' border='0'/></a>";
}

Answer 2

there are LOTS of errors and lazy shortcuts in your code. i made a fiddle and had to correct quite a few places that looks like very hasty work... here is your fiddle, but play it with some devotion: http://jsfiddle.net/uXpeK/

Answer 3

Try giving the image an id of 'image' then using the following:

function show(){
    document.getElementById('image').src = 'photos/picture.jpg'
}

Answer 4

You have an error in your string:

document.getElementById('imageHolder1').innerHTML="<a href="#"><img='photos/picture.jpg' border=0/></a>";

Should read

document.getElementById('imageHolder1').innerHTML="<a href='#'><img src='photos/picture.jpg' border=0/></a>";

(notice " to ' replacement)