javascript - Scroll page to the bottom of a div with jQuery -

i have large divs code samples , i'd add button so, when user clicks on it, page scroll (with ease) bottom of div.

body {    background-color: #ecf0f1;  }  .story {    background-color: #fff;    border-radius: 5px;    height: 500px;    margin: 20px auto;    padding: 10px;    width: 70%;  }

<div class="story">    <button class="scrolltobottom">scroll bottom</button>  </div>  <div class="story">    <button>scroll bottom</button>  </div>  <div class="story">    <button>scroll bottom</button>  </div>  <div class="story">    <button>scroll bottom</button>  </div>  <div class="story">    <button>scroll bottom</button>  </div>  <div class="story">    <button>scroll bottom</button>  </div>  <div class="story">    <button class="scrolltobottom">scroll bottom</button>  </div>  <div class="story">    <button>scroll bottom</button>  </div>  <div class="story">    <button>scroll bottom</button>  </div>  <div class="story">    <button>scroll bottom</button>  </div>  <div class="story">    <button>scroll bottom</button>  </div>  <div class="story">    <button>scroll bottom</button>  </div>  <div class="story">    <button class="scrolltobottom">scroll bottom</button>  </div>  <div class="story">    <button>scroll bottom</button>  </div>  <div class="story">    <button>scroll bottom</button>  </div>  <div class="story">    <button>scroll bottom</button>  </div>  <div class="story">    <button>scroll bottom</button>  </div>  <div class="story">    <button>scroll bottom</button>  </div>

you can set scrolltop scrollheight.

elem.scrolltop = elem.scrollheight; 

if have element want scroll to, call scrollintoview() on reference it.