Changing an image depending on JS variable

I have a list of items that I want downloadable, and when you hover over them, I want an image at the bottom of the list to change.
E.g

<a href="download1.zip">Download</a>
<a href="download2.zip">Download</a>
<img src="hover.png />

Code (markup):

I want "hover.png" to change depending on what list item I am hovering over. How to do this in Javascript?

Thanks,

BP

 

function swap_image(type)
{
    switch (type)
    {
        default:
        case 'zip':
            var image = 'zip.jpg';
        break;
        case 'rar':
            var image = 'rar.jpg';
        break;
    }

    document.getElementById('image').src = image;
}

Code (javascript):

<a href="download1.zip" onmouseover="swap_image('zip');">Download</a>
<a href="download2.rar" onmouseover="swap_image('rar');">Download</a>
<img src="hover.png" id="image" />

HTML:

 

Cool, thanks