I'm new to Javascript so bear with me.

I have a table with 4 thumbnails on the right side. I've used Javascript to display a larger mid-sized image in a 5th cell to their left. This image changes whenever I click on the appropriate thumbnail. I've assigned "MyImage" to that cell's name and my onclick statement reassigns the larger image's nane and displays it properly. So far, so good.

Next I want to click on the mid-size image to bring up a new window with that image displayed in a larger XGA sized resolution. I've tried numerous ways to make this happen but I keep getting the XGA sized image of the first thumbnail and the XGA image size doesn't swap.

The code is as follows:

Code:
<table border="0" width="100%" style="border-collapse: collapse">
  <td rowspan="3" width="70%">
  <p align="center">
  <a target="_blank" href="super_1.jpg">
  <img border="0" src="image_1.jpg" name="MyImage"></a></p></td>

  <td align="center">
  <img border="0" src="thumb_1.jpg"
   onclick="document.MyImage.src='image_1.jpg';"></td>

  <td align="center">
  <img border="0" src="thumb_2.jpg"
   onclick="document.MyImage.src='image_2.jpg';"></td>

</tr>
<tr>

  <td align="center">
  <img border="0" src="thumb_3.jpg"
   onclick="document.MyImage.src='image_3.jpg';"></td>

  <td align="center">
  <img border="0" src="thumb_4.jpg"
   onclick="document.MyImage.src='image_4.jpg';"></td>
</tr>
</table>
I've used "thumb" to reference the thumbnails, "image" to reference the mid-size, and "super" to reference the large XGA sized images. The 4th line of the code, the one with the "super_1.jpg" href is the one that's not working. I've tried all sorts of methods to get this to change but I'm too new to javascript and it's beyond me. But, I'm a fast learner.