JSFiddle - React, Tailwind, and code Playground

HTML

<section>
<div></div><div></div><div></div>
<div></div><div></div><div></div>
<div></div><div></div><div></div>
<div></div><div></div><div></div>
<div></div><div></div><div></div>
<div></div><div></div><div></div>
</section>
<button>Scroll</button>

CSS

button {position: fixed; top: 10px; left: 10px; cursor: pointer}
section {position: fixed; top: 0; bottom: 0; left: 0; width: 60%; overflow-y: scroll}
div {height: 100px}
div:nth-child(odd) {background: #cfc}
div:nth-child(even) {background: #ccf}

JavaScript

$("button").click(function() {
  $("section").animate({scrollTop: "+=50"});
});