JSFiddle - React, Tailwind, and code Playground

HTML

<body><div class="first"><button type="button">Click Me!</button></div>
<div class="nest">
<div class="second">Hi</div>
<div class="third">Sup  GUYS !!!</div>
</div>
</body>

CSS

* {paddin:0;margin:0}
.first {
    width: 100%;
    height: 100px;
    background: rgba(150,150,150,.5)
}

.nest{
    background-color:#f76700;
    height:400px;
    overflow-y:scroll;    

}

.second {
    width: 95%;
    height: 1000px;
    background: #999;
}

.third {
    width: 95%;
    height: 1000px;
    background: #eee;
}

JavaScript

$("button").click(function() {
    $('div.nest').animate({
        scrollTop: $(".third").offset().top-100},
        'slow');
    
});