Xious

Well, I finally figured it out by myself. I used the following code if anyone is interested. <div id="left"><a id="fullname" onclick="pic.src='Images/' + document.getElementById('fullname').innerHTML + '.jpg'; document.getElementById('desc').innerHTML=document.getElementById('fullname').innerHTML" href="#">John Smith</a><br /></div><div id="right" align="left"><img id="pic" src="" alt="" /><br /><p id="desc"></p></div>

I don't want a drop-down box, though. I want just a simple text list in one column and a picture in the other column. When you click on the text name on the left, the picture on the right changes. Something like this: <p><a href=# onclick="pic.src='JohnSmith.jpg'">John Smith</a><br /><a href=# onclick="pic.src='JaneSmith.jpg'">Jane Smith</a><br /><a href=# onclick="pic.src='CoolGuyjpg'">Cool Guy</a></p><img id=pic src="" /> However, I would like not to have to type out the whole onclick for every name. I would like to just extract the name from the list.

I am trying to take a list of names, extract the name and use it for the image name, all while changing one image.ex:John Smith --> JohnSmith.jpg --> img id=pic --> img src=JohnSmith.jpgHopefully that points out what I'm trying to accomplish. Anyways, I know how to do an image swap, but I can't figure out how to extract the text (John Smith) for the image link. Can anyone shed some light. I would like to use as much CSS as possible, but I posted it here cause I think this requires a lot of JavaScript.X