Question

I have a site that uses for example html element id="some_id" several times and I want to change all those elements with jquery, but when I run the jquery code: $("#some_id").attr("href", "new url"); Or for example $("#some_id").text("new text") I only change the first element/object/link.

Like this:

<a id="username">username1</a>
<a id="username">username1</a>

Jquery that edit the first element:

$("#username").text("username2"); 

How do I edit both elements with jquery.

Answer 1

You can’t have duplicate IDs.

Make them a class instead.

<a class="username">username1</a>
<a class="username">username1</a>

$(".username").text("username2");

---

Or make the IDs unique:

<a id="username_1">username1</a>
<a id="username_2">username1</a>

$('a[id^="username_"]').text("username2");

This one uses the attribute-starts-with-selector^[docs] to select <a> elements where the ID begins with username_.