title: jQuery(this).val() not returning the value of the selected option
body: <p>I have the following script at the end of my page:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
      jQuery.noConflict();
      jQuery(function() {
          jQuery('#optElem').change(function(){
              jQuery.post('http://example.com', { 'id1': 1, id2 : jQuery(this).val() },
                  function(data){
                      jQuery('#abc').html(data.payload); 
                      jQuery('#abc').effect("highlight", {}, 3000);
                  }, "json");
          });
      });
  &lt;/script&gt;
  </code></pre>
  
  <p>I have an option select field with id 'optElem'. The code above is supposed to be triggered on the change event, and also I want to pass the value of the selected option to the callback handler. </p>
  
  <p>The change event is correctly being triggered and captured by jQuery, however, I am getting an empty value for id2 (this is supposed to be the value of the selected item).</p>
  
  <p>I am using JQuery(this).val() - but that is suprisingly, returning a blank value - anyone knows why?</p>
  
  <p>The option select field in the HTML looks likes this:</p>
  
  <pre><code>&lt;div&gt;
      &lt;div&gt;
          &lt;span id="yearElem"&gt;Year: &lt;/span&gt;&lt;span id="optElem"&gt;
              &lt;select&gt;
                  &lt;option value="2010"&gt;2010&lt;/option&gt;
                  &lt;option value="2009"&gt;2009&lt;/option&gt;
              &lt;/select&gt;
          &lt;/span&gt;
      &lt;/div&gt;                      
  &lt;/div&gt;
  </code></pre>