JSFiddle - React, Tailwind, and code Playground

HTML

<img src="http://lorempixel.com/100/100/food/1" data-mouseover="http://lorempixel.com/100/100/food/2#500 http://lorempixel.com/100/100/food/3#600 http://lorempixel.com/100/100/food/4#300" />

JavaScript

$('img').on('mouseover', function() {
    var self = this,
        i = 0,
        images = $(this).data('mouseover').split(/\s+/);
    
    (function nextImage() {
        var next = images[i++ % images.length].split('#');
        $(self).data('timeout', setTimeout(function() {
            self.src = next[0];
            nextImage();
        }, next[1]));
    })();
    
}).on('mouseout', function() {
    clearTimeout($(this).data('timeout'));
    this.src = $(this).attr('src');
});