JSFiddle - React, Tailwind, and code Playground

HTML

<div>
       <button type="button"><img src="" alt=""></button>
       <button type="button"><img src="" alt=""></button>
       <button type="button"><img src="" alt=""></button>      
   </div>

<script type="text/javascript">
const images = 
    ["https://i.picsum.photos/id/102/60/60.jpg","https://i.picsum.photos/id/1024/60/60.jpg", 
     "https://i.picsum.photos/id/1062/60/60.jpg","https://i.picsum.photos/id/1069/60/60.jpg"];

  const buttons = document.querySelectorAll("button");

       buttons.forEach(function(el){  el.addEventListener("click", card);   })

       function card(){
           let random = Math.floor( Math.random() * 4);
           let image = this.children[0];
               console.log(image);
           image.src = images[parseInt(random)];
               console.log(image.src);    }
</script>