JSFiddle - React, Tailwind, and code Playground
HTML
<img id='imgClickAndChange1' onclick="changeImage1()" />
Click the image!
CSS
img {
width: 100px;
height: 100px
}
JavaScript
var imageList = ["img1", "img2", "img3"];
// This function returns a random number based on the list length
function getRndNum() {
return Math.floor(Math.random() * (0 - imageList.length)) + imageList.length;
}
function changeImage1() {
var image = this;
// Below we get a random number and use it as the key for the image list array
var src = imageList[getRndNum()];
alert("new image src: " + src);
image.src = src;
}