<ul>
<li>item 11</li>
<li>item 12</li>
<li>item 13</li>
<li>item 13</li>
<li>item 14</li>
<li>item 15</li>
<li>item 16</li>
<li>item 17</li>
<li class="scrolltome">item 18</li>
<li>item 19</li>
<li>item 20</li>
</ul>
<button>!scroll now!</button>
ul {
list-style: none;
height: 100px;
overflow-x: hidden;
overflow-y: scroll;
li {
height: 30px;
background: #ccc;
border-bottom: black 1px solid;
}
}
jQuery('button').on('click',(e)=>{
jQuery('ul').animate({scrollTop: jQuery('.scrolltome').offset().top}, "slow");
});