How to change all elements with the same IDs javascript/html?

Question

I will be working on a table and wanted to change one column with different img src icon.

Here's my sample code:

Html

<img src="" id="mytext">
<img src="" id="mytext">
<img src="" id="mytext">

Javascript

var test = "https://www.datatables.net/media/images/nav-dt.png";
document.getElementById("mytext").src = test;

When i run this it only changes the src of the first instance. How can i change them all?

score -1 · Answer 1 · answered Jul 31 '17 at 09:24

You can't use multiple sample id's on sample page, better to use class instead id.

You can see example here: Demo

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  <style>
    div.mytext{
      color:red;
    }
  </style>
  <script>
    $(document).ready(function(){
       $("#btn").click(function() {
         $("div").addClass('mytext');
      });
    });
  </script>
</head>
<body>
<button id="btn">Change All Divs Class</button>
<div id="content1">Hi</div>
<div id="content2">Hi</div>
<div id="content3">Hi</div>
</body>
</html>

How to change all elements with the same IDs javascript/html?

1 Answers1