JSFiddle - React, Tailwind, and code Playground

HTML

<img id="myLight"></img>

CSS

#myLight {
  background-image: url(blank.png);
  width: 230px;
  height: 220px;
}

JavaScript

var myTraffic = document.getElementById('myLight');
var myPics = ['http://media.hsl.washington.edu/media/schnall/nurs499c/url.gif', 'http://seofreelancermumbai.in/wp-content/uploads/2016/01/SEO-URL-1.jpg', 'https://upload.wikimedia.org/wikipedia/commons/thumb/c/c3/URI_Euler_Diagram_no_lone_URIs.svg/2000px-URI_Euler_Diagram_no_lone_URIs.svg.png'];
var totalPics = myPics.length;
var i = 0;
let timer = null;

function loop() {
  if (i > (totalPics - 1)) {
    i = 0;
  }
  myLight.src = myPics[i];
  i++;
}


myTraffic.onmouseover = () => {
  clearInterval(timer);
  loop();
  timer = setInterval(loop, 3000)
}

myTraffic.onmouseout = () => {
  clearInterval(timer);
}