How to refer to DOM elements for cloneNode(true)

[jholder]

People,
I must really need more coffee, since this should be pretty simple, and I'm just not seeing it. I've got an element that has been created via JS and the DOM. I want to use cloneNode to duplicate it and then change a few of the attributes before showing it to the viewer again. My question is this, how do i refer to the certain elements inside of the cloned node?

For example:

var diva = document.createElement('div');
var para = document.createElement('p');
var imga =document.createElement('img');
var imgb =document.createElement('img');
var ancha = document.createElement('a');
ancha.setAttribute('href','http://www.google.com');
ancha.appendChild(document.createTextNode('www.google.com'));

imga.setAttribute('src','image1.png');
imgb.setAttribute('src','image2.png');
para.appendChild(ancha);
para.appendChild(imga);
para.appendChild(imgb);
diva.appendChild(para);
window.document.getElementById('bubba').appendChild(diva);

var dupe = diva.cloneNode(true);

Ok, so 'dupe' should now contain a perfectly cloned node. I want to change the href of the anchor of the cloned node to link to http://www.yahoo.com and the text of the anchor to say www.yahoo.com.

There has to be an easy way to do it, but I can't figure it out, and i just can't come up with the correct keyword combo to find it on google.


What I'm really looking for is some way to refer to the elements ordinally, or with a name/tag etc. I dont really want to refer to them as children if i don't have to. something like dupe.getElememtByTagName('img').item(0) or (1). something like that.


Can someone point me in the right direction?

Thanks,

--james

[Fang]

dupe.getElementsByTagName('a')[0].setAttribute('href','http://www.yahoo.com');
You may have to append dupa to the document before referencing it. So dupe would be changed to a different object.