javascript - Call same onClick function for different buttons on the same HTML page -

i new javascript forgive me if question sounds stupid. have various icons(the same icon repeated again , again) on page represented

<img src="/images/info_icon.gif" id="tooltip_icon" alt="hee haa"> <img src="/images/info_icon.gif" id="tooltip_icon" alt="hee haa"> <img src="/images/info_icon.gif" id="tooltip_icon" alt="hee haa">  

now, want call javascript function opens popup window when click on of these icons -

// modal var modal = document.getelementbyid('mymodal');  // button opens modal var btn = document.getelementbyid("tooltip_icon");  // <span> element closes modal var span = document.getelementsbyclassname("close")[0];  // when user clicks button, open modal  btn.onclick = function() {     modal.style.display = "block"; }  // when user clicks on <span> (x), close modal span.onclick = function() {     modal.style.display = "none"; }  // when user clicks anywhere outside of modal, close window.onclick = function(event) {     if (event.target == modal) {         modal.style.display = "none";     } } 

now, because trying element id, 1 of icon results in modal when clicked while function not called (obviously) when click on others.

i want same function called if click on of icons.

how achieve this? please find code here - https://jsfiddle.net/up5bd22s/1/

thanks in advance!

you can't use multiple identical ids on different elements -- invalid html. id meant unique -- social security number form of unique id.

i think want collection of elements, iterate on them update onclick. i'd recommend refactoring this

// modal var modal = document.getelementbyid('mymodal');  // button opens modal var btn = document.getelementsbyclassname(".tooltip_icon");  // <span> element closes modal var span = document.getelementsbyclassname("close")[0];  // when user clicks button, open modal  function displaymodal() {     modal.style.display = "block"; }  // when user clicks on <span> (x), close modal function hidemodal() {     modal.style.display = "none"; }  (var i=0; i<btn.length; i++) {     btn[i].onclick = displaymodal; }  span.onclick = hidemodal;  // when user clicks anywhere outside of modal, close window.onclick = function(event) {     if (event.target == modal) {         hidemodal();     } } 

(this is, of course, after updating repeated ids classes.)