Scrolling to an element in a div with overflow set to scroll - reactjs

Question

I am building a time block with all the hours of the day the container only takes up 75vh and is set to scroll on overflow. I am trying to have the page load and scroll to the current time within my time block but I am having trouble figuring how to scroll within the div instead of the whole page. This works when I have the container set to 100vh but the overflow: scroll is creating a real issue for me. I see lots of answers for this issue in Angular an jQuery. But I am trying to do this in reactjs, and Im not sure how to target the scroll bar within my div.
onLoad I am calling this function:
const scrollToTime = () => {
const currentHour = moment().hour().toString()
const currentTimeEl = document.getElementById(currentHour)
window.scrollTo({
top: currentTimeEl.offsetTop,
behavior: "smooth"
})
}
I've thought of using Element.scrollTo() but this does not work.
This is a short snippet of what my container looks like:
<div className="dayView">
<hr className="day-divider1" />
<div className='dayView-timeSlot' id="12">
<Row className="time-row" >
<Col md="1" className="time-label">12:00 AM</Col>
<Col md="1" className="trash"><Trash /></Col>
<Col md="8" className="appointment-slot">
{" "}
</Col>
</Row>
</div>
<hr className="day-divider-dashed" />
<div className='dayView-timeSlot' id="12">
<Row className="time-row">
<Col md="1" className="time-label">12:30 AM</Col>
<Col md="1" className="trash"><Trash /></Col>
<Col md="8" className="appointment-slot">
{" "}
</Col>
</Row>
</div>
<hr className="day-divider1" />
...
</div>
.dayView{
height: 75vh;
overflow: scroll;
}
Is there a way to target the scroll within my dayView container?