title: Get value of select loaded with AJAX
body: <p>I am loading a select via AJAX and then trying to use the value of the select for another AJAX call. </p>
  
  <p>So I have: </p>
  
  <pre><code>&lt;select id ="thisSelect"&gt;
    &lt;option value = "someValue1"&gt; Some Value 1 &lt;/option&gt;
    &lt;option value = "someValue2"&gt; Some Value 2 &lt;/option&gt;
  &lt;/select&gt;
  </code></pre>
  
  <p>This loads fine.  Then I am trying to access the value of thisSelect like so: </p>
  
  <pre><code>$(document).ready(function(){
      var value = $('#thisSelect').val(); 
      alert(value); 
  });
  </code></pre>
  
  <p>It only registers the first value that the select loaded with in the original AJAX call and isn't capturing any of the changes.  </p>
  
  <p>Any ideas?  I tried: </p>
  
  <pre><code> $('#thisSelect').on('change', function() {
      var value = (this.value);
      //or
      alert(this.value);  
  });
  </code></pre>
  
  <p>in the same $(document).ready block, but 'value' shows up as undefined and I don't get an alert box.  </p>