JSFiddle - React, Tailwind, and code Playground

HTML

<div class="navigation">
        <a href="#" id="prev">Previous</a>
        <br>
        <a href="#" id="next">Next</a>
    </div>
    <div class="demo-container">
    <p>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. 
    Fusce vestibulum, enim sed adipiscing rhoncus, quam mi auctor 
    lorem, ac molestie augue lacus luctus dolor. Quisque ac felis
    adipiscing, porta justo vitae, semper ligula. Morbi consectetur
    hendrerit mi, nec dictum urna scelerisque sit amet. Aliquam 
    molestie quis nisi eget scelerisque. Ut at felis tristique,
    adipiscing nibh vel, accumsan nisl. Aenean venenatis quis 
    justo tincidunt laoreet. Nullam et tellus et lorem faucibus 
    auctor quis vel eros. Curabitur tortor nisi, rhoncus sit 
    amet placerat nec, eleifend vel mi.Pellentesque suscipit, 
    tortor eget ultricies facilisis, orci felis vulputate lectus, 
    et lobortis mauris dolor id metus. Quisque ut nunc aliquam,
    vulputate justo eget, commodo nisl. Cras nulla sem, congue a 
    vulputate ut, blandit nec sem. Ut ullamcorper, justo in hendrerit
    pharetra, ligula elit convallis velit, commodo rhoncus purus urna
    sit amet purus. Interdum et malesuada fames ac ante ipsum primis in
    faucibus. Cras metus diam, vulputate eget malesuada eget, vulputate
    ut dolor. Donec congue purus sit amet elit hendrerit, ornare
    facilisis ipsum elementum.Praesent congue sit amet dolor id
    volutpat. Aenean non pellentesque orci, sit amet porttitor urna.
    Nunc cursus malesuada elit, in vehicula nisl fringilla eu. Sed quis
    purus gravida libero semper laoreet. In at leo ac nulla venenatis
    porta ac vitae ligula. Cras ac dignissim leo. Aenean in lectus in
    nunc egestas commodo. Aenean nec arcu nec erat eleifend euismod.
    Nulla lobortis leo sit amet convallis commodo. Phasellus lacinia
    libero vel felis faucibus dignissim ultricies quis lectus. In metus
    ante, ornare et dapibus vitae, blandit ac ipsum. Maecenas congue 
   ...

CSS

.highlight{
   background-color:red;
}

.navigation{
     position:fixed;
     background: #FFFFFF;
     padding:5px;
     border: 1px solid;
}
}

JavaScript

/**  scroll to element function **/
		function scrollToElement(selector, time, verticalOffset) {
			time = typeof(time) != 'undefined' ? time : 500;
			verticalOffset = typeof(verticalOffset) != 'undefined' ? verticalOffset : 0;
			element = $(selector);
			offset = element.offset();
			offsetTop = offset.top + verticalOffset;
			$('html, body').animate({
				scrollTop: offsetTop
			}, time);			
		}

    /**document ready**/		
		$(document).ready(function() {
               count = 0;
   /* scroll to 150px before .highlight with animation time of 1000ms */
				$('#next').click(function (e) {
                    count++;
					e.preventDefault();
                    scrollToElement('.highlight:nth-child(' + count + ')', 1000, -150);
				}); 
        });