JSFiddle - React, Tailwind, and code Playground

by HumptyDumptyEIZ

HTML

<div id="top"><span style="color:blue;font-style:underline;cursor:pointer;cursor:hand;">TOP</span></div>
<p>
    <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>        
    <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
    <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
    <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
    <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
    <br><br><br><br>
</p>
<div id="bottom"><span style="color:blue;font-style:underline;cursor:pointer;cursor:hand;">BOTTOM</span></div>

JavaScript

$(document).ready(function(){

    $("#top").click(function(){
        $("html, body").animate({
            scrollTop: $("#bottom").offset().top
        }, 2000);
        
    });
    
     $("#bottom").click(function(){
        $("html, body").animate({
            scrollTop: $("#top").offset().top
        }, 2000);
        
    });

})