Change ID of element using JavaScript

[KeredDrahcir]

I'm working on some HTML code written by someone else. I can't change it and he's carelessly created two different elements with same ID. I need to access one of them using JavaScript but getElementById won't work. They are both encased inside division with different classes. Is there any way to access one in JavaScript without causing a conflict?

<div class="header">
<div class="search">
    <form name="form_seach" action="[I]my page[/I]" method="post">
        <input type="text" id="search_key" name="search_key" value="" style="width:110px;" /> 
		<input type="submit" name="submit_search" id="[B]submit_search[/B]" value="Search"/>
    </form>
</div>
</div>

<div class="aite_search">
    <form name="site_seach" action="my page" method="post">
        <input type="text" placeholder="Search..." id="search_key" name="search_key" value=""  />
		<input type="submit" name="submit_search" id="submit_search" value="Search"/>
    </form>
</div>

[Dormilich]

getElementById( ) won’t work no matter what you’ll try.

I’d suspect that you could get them via CSS paths in document.queryS elector().

[KeredDrahcir]

Thanks for that. That works perfectly. Just what I needed.
By the way, is there any way to change the name of an ID using JavaScript?

[Dormilich]

By the way, is there any way to change the name of an ID using JavaScript?

sure, in JavaScript you can change anything that is not explicitly read-only.

[KeredDrahcir]

Would be able to point me towards the command I'd need to use or point me to a resource where I could find the command?
Thanks.

[Dormilich]

the command would be, er, assignment? (really it’s just like a="b")

good resource: Mozilla Developer Network (or just google mdn + search phrase)

[KeredDrahcir]

Okay thanks. Would this affect just the ID?

document.querySelector('div.site_search #submit_search')='search_submit';

[Dormilich]

no, that would cause an error (you cannot assign a string to a Node).

I thought it would be obvious that you need to assign the id property of the node.

well, you definitely need to read this (http://www.html5rocks.com/en/tutoria...wbrowserswork/) and then you need to read about DOM and Objects in JavaScript, because these are the absolute basics you’ll always need.

[KeredDrahcir]

Yes. I thought that wouldn't work. As you can probably guess I need to change the ID so that both objects would have a different ID. I was using the Search as an example since I've already posted the code.

What I'm thinking about now is that the person who wrote the code also had two input fields, one of the contact form and one on a newsletter signup form both with the E-mail field having the same ID.
This causes conflict when using equalTo to validate the Confirm E-mail field. I was hoping to change the ID of the field on the Newsletter Sign Up but I need to access it by some other means to make sure I change the ID of the correct element.

I'll have a read of the link you've included but do you think this is going to be possible? I am willing to use small amount of php if nessesary.

[Dormilich]

Yes. I thought that wouldn't work. As you can probably guess I need to change the ID so that both objects would have a different ID.

this brings up the question, how do you change—in general—a property of a DOM object?