[jQuery] Calling text() on a textarea doesn't work after I've typed in it

[Lowell]

I am getting unexpected behavior. It seems that changing the text of a
text box doesn't work once I've typed into it. I've given a pared down
version of my code below. The way it works is:

- before typing anything into the text area, you can click on the
links on the page and they will set the text in the text area. Try
clicking each of them to see that it does indeed work.
- once a user has typed into the text area, those links stop
working.

Any idea what I might be doing wrong to be breaking this?

Thanks,
Lowell

----

<script type="text/javascript" src="http://jquery.com/src/jquery-
latest.js"></script>
<script>
$(function() {
    /* make sample code clickable */
    $('.sampleCode').click(function() {
        var text = $.trim($(this).text());
        $('textarea').text(text);
        return false;
    });
});
</script>

<textarea cols="80" rows="10">hello world</textarea>

<h2>Populate with sample code:</h2>

jQuery:
<a href="#" class="sampleCode">$('p').css('border', '1px solid red)</
a>

<br/>

prototype:
<a href="#" class="sampleCode">$('p').hide()</a>