JSFiddle - React, Tailwind, and code Playground

HTML

<div class="slider-one">
     <button type="button" class="prev-btn">Prev</button>
    <div class="image-container">Here goes the sprite strip</div>
<button type="button" class="next-btn">Next</button>    
</div>

CSS

.slider-one {height:200px; width:200px; background-color:#567;}
.image-container {height:100px; width:100px; background-color:#789; color:#efefef;}

JavaScript

$(function () {

    var i = 0,
        numberOfImages = 5;

    // Handle click on next button
    $(".next-btn").click(function () {
        // Increase by one, and restart when we reach the last image
        i = ((i + 1) < numberOfImages) ? i + 1 : 0;
        var position = calculateBackgroundPosition(i);
        $(".image-container").css("backgroundPosition", position);
    });
});

function calculateBackgroundPosition(index)
{
    return "0 " + (index * 100 * -1) + "px";
}