ImageButton: change icon from client function?

[gjm]

I have an image button and am trying to get both client-side and server side events working. Both client events and server events are firing but when I try to change the icon on the client-side, nothing happens.

Here is my button:

<asp:ImageButton ID="IMG1" OnClientClick="GridClick(this);" runat="server" ImageUrl="~/Images/GridViewMS.bmp" OnClick="IMG1_Click" />

Here is my javascript function:

function GridClick(ctl)
{
debugger

// I have tried several method to change the icon image but nothing has worked.
// I have commented out those techniques that do not change the icon

// Attempt #1 ...
//ctl.src = "http://localhost:3061/Images/GridViewMSSelected.bmp"; // this does not change the icon

//Attempt #2 ...
//ctl.src = "Images/GridViewMSSelected.bmp"; // this does not change the icon

// Attempt #3 ...
// var preMS = ctl.id.split("_")[0] + "_";
// document.getElementById(preMS + 'IMG1').src="~/Images/GridViewMSSelected.bmp";





}


The GridClick function executes but none of my attempts at changing the icon on the client-side works. The IMG1_Click routine is successfully entered after the GridClick function is finished but the icon has not changed. I want to change the icon on the client-side because later on I want to skip the server side event in certain cases (I understand I can do this by executing 'return false;' from the client function) .

How do I change the icon from the client function?