dynamically change image source

[rizlaa]

i have a tabular form with several of the following:

<A HREF="javascript:genCal_X()">< img src="cal.gif" border="0" /></DIV></A>

where the _X refers the to the row. I am able to retrieve and dynamically change the href value using the following:

var links=document.getElementsByTagName('A');
calExp = new RegExp("genCal_"+calRow);
for (var i=0;i<links.length;i++) {
if (links[i].href.match(calExp)) {
links[i].href="javascript:void(0);";
}
}

i want to be able to change the image source as well but am not sure how to gaurantee i change the one associated to the changed href value...

[rizlaa]

have tried the following:

var links=document.getElementsByTagName('A');
calExp = new RegExp("genCal_"+calRow);
srcExp = new RegExp("cal.gif");
for (var i=0;i<links.length;i++) {
if (links[i].href.match(calExp)) {
links[i].href="javascript:void(0);";
links[i].innerHTML = links[i].innerHTML.replace(srcExp, "newIMG.gif");
}
}

this works but the innerHTML does not like the lone </DIV> it automatically places a <DIV> tag in front of it thereby adding an additional blank line.

any idea how i can over come this <DIV> tag addition??
(the code is generated by a wizard and so i have to live with the way it is generated)

[Eclyps19]

exactly why do you have a </div> without a <div> somewhere infront of it?

[rizlaa]

The wizard generates <DIV> tag in front of the <A> tag along with a bit of other code. It does this to be able to cater for various scenarios.

I am not able to change the way the code is generated. just need to be able to manipulate it. I'm hoping there is a way of using innerHTML with just a </DIV>??

[rizlaa]

the following works!!
var links=document.getElementsByTagName('A');
calExp = new RegExp("genCal_"+calRow);
srcExp = new RegExp("cal.gif");
for (var i=0;i<links.length;i++) {
if (links[i].href.match(calExp)) {
links[i].href="javascript:void(0);";
links[i].firstChild.src = links[i].firstChild.src.replace(srcExp, "newIMG.gif");
}
}