title: Auto follow scroll bar in div
body: <p>Basically, I've created some kind of <strong>Autolog</strong> which has a scrollable DIV using the CSS code below</p>
  
  <pre><code>.myClass {
  position: relative;
  padding: 39px 14px 14px;
  margin-bottom: -1px;
  border: 1px solid #ddd;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  height: 200px;
  overflow: auto;
  }
  </code></pre>
  
  <p>Basically, data is being placed inside this div dynamically using JQuery as shown below which is fetched from an external source</p>
  
  <pre><code>$.each(data.search, function (i, v) {
          $('.myClass').append('my content here');
  });
  </code></pre>
  
  <p>The div is looks as simple as this</p>
  
  <pre><code>&lt;div class="myClass"&gt;
  
  &lt;/div&gt;
  </code></pre>
  
  <p>What i want the div to do, is as the content is becoming <code>overflow</code> i want the scrollbar at the side to automatically scroll to the bottom to follow the <strong>AutoLog</strong> instead of having to manually keep scrolling the bar to the bottom yourself, I'm sure this can be acheived via <strong>Javascript</strong> but not sure how, if anyone could point me in the right direction that'd be great,</p>