How to scroll to the last position (item 10) of the table on the top of the DIV? <p>HTML code - </p> <pre><code>&lt;div id="scroll-pane" style="width:250px; height:100px; overflow-y:scroll; overflow-x:hidden;"&gt; &lt;table&gt; &lt;tr&gt;&lt;td&gt;item 0&lt;/td&gt;&lt;/tr&gt; &lt;tr&gt;&lt;td&gt;item 1&lt;/td&gt;&lt;/tr&gt; &lt;tr&gt;&lt;td&gt;item 2&lt;/td&gt;&lt;/tr&gt; &lt;tr&gt;&lt;td&gt;item 3&lt;/td&gt;&lt;/tr&gt; &lt;tr&gt;&lt;td&gt;item 4&lt;/td&gt;&lt;/tr&gt; &lt;tr&gt;&lt;td&gt;item 5&lt;/td&gt;&lt;/tr&gt; &lt;tr&gt;&lt;td&gt;item 6&lt;/td&gt;&lt;/tr&gt; &lt;tr&gt;&lt;td&gt;item 7&lt;/td&gt;&lt;/tr&gt; &lt;tr&gt;&lt;td&gt;item 8&lt;/td&gt;&lt;/tr&gt; &lt;tr&gt;&lt;td&gt;item 9&lt;/td&gt;&lt;/tr&gt; &lt;tr&gt;&lt;td&gt;item 10&lt;/td&gt;&lt;/tr&gt; &lt;/table&gt; &lt;/div&gt; </code></pre> <p>Javascript code - </p> <pre><code>var divEl = document.getElementById("scroll-pane"); var selectedTrEl = undefined; function select(index) { var trEl = divEl.getElementsByTagName("tr")[index]; if(selectedTrEl) { selectedTrEl.className = ""; } selectedTrEl = trEl; selectedTrEl.className = "selected"; var scrollTo = selectedTrEl.offsetTop; divEl.scrollTop = scrollTo; } select(10); </code></pre> <p>JS example: <a href="http://jsfiddle.net/7a960tdr/1/" rel="nofollow">http://jsfiddle.net/7a960tdr/1/</a></p> <p>I want that item 10 show in the top of the div, but seems I've to do something else to do it.</p>