title: jQuery: Accessing a textarea's current text from a button's click
body: <p>I'm writing a function to make an AJAX POST request on the click of an input button with jQuery. The button's click function is being defined in <code>$(document).ready()</code>. What I'm noticing is, when the button is clicked, the text pulled from the textarea is the default text it was populated with, and not whatever the user may have changed it to. Code snippet follows:</p>
  
  <pre><code>$(document).ready(function() {
  
    $('#add-note-button').click(function() {
      var note_data = {};
      note_data["notetext"] = $('#notetext').text();
      alert($('#notetext').text());
      note_data["author"] = 123;
  
      $.ajax( {
        type:'POST',
        url:'/myapp/post_note/1/',
        data:note_data,
        success: function(data){
        }
      });
    });
  });
  </code></pre>
  
  <p>Later on in the HTML:</p>
  
  <pre><code>&lt;textarea id="notetext"&gt;Add status update... &lt;/textarea&gt;
  &lt;input id='add-note-button' type='submit' value="Save"/&gt;
  </code></pre>
  
  <p>The <code>alert($('#notetext').text());</code> from the <code>click()</code> function above only ever shows "Add status update..." and not the text I am typing into the textarea. </p>
  
  <p>Appreciate the help! </p>