"Highlight" og "de-highlight" af billede

Hej.

Jeg har en produktside hvor produktbilledet, selvfølgelig skal kunne skiftes, således at kunden kan se flere af disse.
Til at skifte mellem billederne har jeg en række "tal-billeder" (i stedet for tal/tekst). Når jeg trykker på f.eks. tallet 3 vises tal nr. 3 i rækken, samtidig med at dette tal (dvs. "tal-billedet") bliver highlighted - I dette tilfælde ved at javascript i et link ændrer på billedets src.

Mit problem er bare, at hvis jeg - herefter - vælger f.eks. billede nr. 4, bliver "tal-billedet" nr. 3 ikke "de-highlighted", dvs det går ikke tilbage, når et nyt billede vælges; Hvordan gør jeg således at dette sker, samt at tallet 1 automatisk er highlighted når siden åbnes første gang eller opdateres?

Koden ser ud som følger:

(<?php $i; ?> bruges til at udskrive selve tallet, da antallet af "billede-tal" udregnes via en while-løkke i PHP)

<script type="text/JavaScript">     
function changeImage(refElm, strImageId, strImgPath)
{
    var img = document.getElementById(strImageId);
 
    img.src = strImgPath;
 
    img.onclick = function() { window.location = refElm.href; };
}
</script>

<script type="text/JavaScript">     
function changeImageNumber(refElm, strImageId, strImgPath)
{
    var img = document.getElementById(strImageId);
 
    img.src = strImgPath;
 
    img.onclick = function() { window.location = refElm.href; };
}
</script>

<img id="productimage" src="images/products/1_thumb/1.png" alt="Click to enlarge" border="0" style="border:1px solid #b2b2b2;" />

<a onclick="changeImage(this, 'productimage', 'images/products/1_thumb/<?php echo $i; ?>.png'); changeImageNumber(this, 'number<?php echo $i; ?>', 'images/numbers/hover/<?php echo $i; ?>.png');" href="java script:void(0);">
    <img id="number<?php echo $i; ?>" src="images/numbers/<?php echo $i; ?>.png" width="11" height="7" alt="" border="0" />
</a>

Jeg håber at jeg har kunne beskrive mit problem, således at dette kan forstås!

Mvh,