Swap Image and JS link onclick

[mmic]

NOOB Alert! - So after two days of searching, trying and smashing things while my manager breathes down my neck for a result, I'm forced to plead for help with this:

I'm doing a multiple animated div page where i'd like to have a simple image with rollover effect. I'm using jquery as well.

The initial onclick would be a call to hide a specific group of id's. I have this working with the following:

<a href="javascript:animatedcollapse.show(unique_group_of_IDs)"><img src="sample_state1.png"></a>

and to hide:

<a href="javascript:animatedcollapse.hide(unique_group_of_IDs)"><img src="sample_state2.png"></a>

So! The question is how can I have one image/image rollover and link call to that js command and then swap to another image/image rollover and link while staying on the same page?

Thanks, I'm stuck and desperate and have looked everywhere (i think) :S.

[MattF]

Something like this, if I recall correctly.

<img id="sample_state" src="sample_state1.png">

Then, in your function:

if (getElementById('sample_state').src == 'sample_state2.png')
{
    getElementById('sample_state').src =  'sample_state1.png';
}
else
{
    getElementById('sample_state').src =  'sample_state2.png';
}

[mmic]

Thanks for the reply Matt! How do I swap out the links? Sorry if it's obvious to you but I'm stumped.

[mmic]

does anyone know how to make the links dynamic as well? thanks.