Screenshot 1: Unchanged:

Screenshot 2: Changed, yet .val() shows original :

.val() always returns the same thing, because in the HTML, the text inbetween the <textarea> tags remains the same.
<textarea id="suggested_text" name="suggested_text" style="width: 100%; height: 250px;">Enter your comment(s) then click submit.</textarea>
How do I get this to behave normally? so I can actually retrieve the value of what is typed in the box?
You should use
instead!
You may see it live:
http://jsfiddle.net/Z6rmb/
EDIT:
Just realized that on the link above I used .val(), so it also worked fine for me and html as I first proposed not!!!