JSFiddle - React, Tailwind, and code Playground
HTML
<select>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
</select>
<div id="scrollBox">
</div>
CSS
#scrollBox {
border: 1px solid #ccc;
overflow-y: scroll;
word-wrap: break-word;
background: #fff;
color: #000;
text-align: left;
position: absolute;
top: 50px;
left: 0;
right: 0;
width: 100px;
height: 300px;
}
#scrollBox div {
height: 50px;
border: 1px solid #00f;
}
JavaScript
function addContent()
{
$('#scrollBox').append('<div>');
$('#scrollBox').scrollTop($('#scrollBox').prop('scrollHeight'));
setTimeout(addContent,500);
}
setTimeout(addContent,500);