JS: accessing img attributes that were assigned randomly
<p>I have a page with a block of thumbnails (small images) and I would like a bigger version of the image to appear when a small image is clicked on. Both files have identical names but are in different folders. The problem is, the thumbnails are generated randomly using a for loop. Here is the script I am working on (onclick):</p>

<pre><code>function seeFoto(that){
document.getElementById("photoViewer").style.zIndex="1";
document.getElementById("gallery").style.zIndex="0";
document.getElementById("bigpic").src=.../// &lt;&lt;-- problem: how do I get the source of the thumbnail and then replace "bigpic" with other version of the image??
</code></pre>

<p>Here is the script that assigns each cell a random image (it works):</p>

<pre><code>function randomThumbs(){
swapp();
var onecell="1";
for (onecell=1; onecell&lt;33; onecell++){
var duh=Math.ceil(Math.random()*802);
document.getElementById("img" +onecell).setAttribute("src","thumbs/"+duh+".jpg");
}}
</code></pre>

<p>swapp() is a function that randomly selects two cells and changes the picture to another random picture. Html code:</p>

<pre><code>&lt;td&gt;&lt;a id="link1" href="page.html" &lt;img id="img1" src="thumbs/1.jpg" onclick="seeFoto(this)" /&gt;&lt;/a&gt;&lt;/td&gt;
&lt;td&gt;&lt;a id="link2" href="page.html" &lt;img id="img2" src="thumbs/2.jpg" onclick="seeFoto(this)" /&gt;&lt;/a&gt;&lt;/td&gt;
</code></pre>

<p>Hope my question is clear enough...
Thanks!</p>
