Changing Input Image State

I have some inputs with images that I'm changing the source for onmouseover and onfocus. I want to move the js from the HTML and use a script that does the same thing for all instances of the buttons throughout the site (there's only two at the moment). So far I've got this:

function buttons() {     var goBtn = document.getElementById("go-btn");     var subBtn = document.getElementById("submit-btn");     goBtn.onmouseover=function() { action(this,"go","on"); }     goBtn.onfocus=function() { action(this,"go","on"); }     goBtn.onmouseout=function() { action(this,"go","off"); }     goBtn.onblur=function() { action(this,"go","off"); }     subBtn.onmouseover=function() { action(this,"submit","on"); }     subBtn.onfocus=function() { action(this,"submit","on"); }     subBtn.onmouseout=function() { action(this,"submit","off"); }     subBtn.onblur=function() { action(this,"submit","off"); }          function action(ID,name,state) { ID.src='/images/'+name+'-button-'+state+'.gif' } } window.onload=buttons;

That doesn't look very lean and it works erratically. On a page where both buttons exist, it works in Firefox but only one of the buttons works in IE (the second one) and in Firefox the script won't work if the first button is not present on the page. So what would be the best way to do it?