JSFiddle - React, Tailwind, and code Playground

HTML

<div id="top">Hello, I'm the top-gun!</div>
<div id="bottom">Hello, I'm the bottom end :(</div>

CSS

#top {
    position: absolute;
    top: 0;
}

#bottom {
    position: absolute;
    top: 1200px;
}

JavaScript

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

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