Scroll to down in textarea with jQuery

Question

<h2>Greetings</h2>
<div class="container">
  <div class="inner">
    Hello
    <p>Test</p>
  </div>
  <textarea id="one" class="inner">
    Goodbye
</textarea>
</div>

$("#one").append("your text to append");
$("#one").append("your text to append");
$("#one").append("your text to append");
$("#one").append("your text to append");

LIVE: http://jsfiddle.net/tGFmq/

how can i make automatically scroll to down in this textarea?

Answer 1

Add this bit to your code (preferably at the end of whatever inserts you have):

    var psconsole = $('#one');
    if(psconsole.length)
       psconsole.scrollTop(psconsole[0].scrollHeight - psconsole.height());

Answer 2

See this Live Demo: here

To calculate the bottom scrollTop, you can simply subtract the height from the scrollHeight:

var oneDiv = $("#one");
bottom = oneDiv.prop('scrollHeight') - oneDiv.height()

Then you can set its scrollTop to bottom, or use amazing jQuery's animate() for cool animation.

Live Demo: here

Answer 3

I realised my problem was that I had the code in the incorrect place. -> Placed under the element and got the problem to solve (rookie mistake....) -- Just a reminder to all.