jquery - jqueryコードで変数が設定されない

Question

style = diplay:none で初期化されているため、フェードイン後にユーザーがテキストを入力できるようにする、id txtArea のテキストエリアがあるこれらの単純な行があります。

  var area = $('#txtArea');
  str = area.val();
  document.write("here i am" + str);

これが印刷されると、「ここにいます」と表示されます なぜ変数が入力をキャプチャしないのですか?

txtArea を含む div の html は

</div>
<div id="newtext" style="display:none" >
<textarea rows="50" cols="200" id = "txtArea"  > </textarea>
<button class="btn2">SEE YOUR TEXT</button>

</div>