JSFiddle - React, Tailwind, and code Playground
by Sub Lines
HTML
<div class="foo"></div>
<div class="foo"></div>
<div class="foo"></div>
CSS
.foo {
height: 100px;
width: 100px;
background-color: red;
background-size: 100% 100%;
}
JavaScript
function setBackground(urls, targetId) {
setInterval(function() {
var index = Math.floor(Math.random() * (urls.length));
var target = document.getElementsByClassName(targetId);
target.style.backgroundImage = "url(" + urls[index] + ")";
}, 5000);
}
var urls = [
'http://placekitten.com/g/150/150',
'http://placekitten.com/g/200/200',
'http://placekitten.com/g/250/250',
'http://placekitten.com/g/300/300',
'http://placekitten.com/g/400/400'
];
var target = "foo";
setBackground(urls, target);