title: change() event not working on appended inputs
body: <blockquote>
    <p><strong>Possible Duplicate:</strong><br>
    <a href="https://stackoverflow.com/questions/8444862/jquery-change-for-appended-select-doesnt-work">jQuery - .change() for appended select doesn’t work</a>  </p>
  </blockquote>
  
  
  
  <p>I am trying to submit a form to a php file every time a  value changes... I have a function that also allows the user to add another field of inputs </p>
  
  <p>For the sake of this example I will refer to the default fields (the ones readily available when the user enters the page) as the 'default field' and any added rows as 'added field'.</p>
  
  <p>So what happens is when the user clicks on the default field and chooses a value the form automatically submits.. But then the user adds a row and then chooses a value for the added field the form does not automatically submit...the user has to actually click submit I tried adding an id to the added field and access it through jquery using that id but it still doesn't work.. its like since the added rows are appended, jquery doesn't recognize them... probably wrong but thats my best guess.</p>
  
  <p>Here is my jquery:</p>
  
  <pre><code>$(function(){
       $("select").change(function(){
      $("#myform").submit();
       });
       $('#rowInput select').change(function(){
      $("#myform").submit();
       });
  
     });
  
  
  $(function(){
          $("#add").click(function(){
              $("&lt;tr id = 'rowInput'&gt;&lt;td&gt;&lt;select name = 'grades[]'&gt;&lt;option value = '0'&gt; SELECT &lt;/option&gt;&lt;option value = 'A'&gt;A&lt;/option&gt;&lt;option value = 'AMINUS'&gt;A-&lt;/option&gt;&lt;option value = 'BPLUS'&gt;B+ &lt;/option&gt;&lt;option value = 'B'&gt;B&lt;/option&gt;&lt;option value = 'BMINUS'&gt;B-&lt;/option&gt;&lt;option value = 'CPLUS'&gt;C+ &lt;/option&gt;&lt;option value = 'C'&gt;C&lt;/option&gt;&lt;option value = 'CMINUS'&gt;C-&lt;/option&gt;&lt;option value = 'DPLUS'&gt;D+ &lt;/option&gt;&lt;option value = 'D'&gt;D&lt;/option&gt;&lt;option value = 'DMINUS'&gt;D-&lt;/option&gt;&lt;option value ='F'&gt;F&lt;/option&gt;&lt;/select&gt;&lt;/td&gt;&lt;/tr&gt;").fadeIn(200).appendTo("table");
  
          });
  </code></pre>
  
  <p>the html :</p>
  
  <pre><code>&lt;form id = 'myform'&gt;
     &lt;table&gt;
        &lt;tr&gt;&lt;td&gt; 
          &lt;select name = 'grades[]'&gt;
               &lt;option value = '0'&gt; SELECT &lt;/option&gt;
               &lt;option value = 'A'&gt;A&lt;/option&gt;
               &lt;option value = 'AMINUS'&gt;A-&lt;/option&gt;
               &lt;option value = 'BPLUS'&gt;B+ &lt;/option&gt;
               &lt;option value = 'B'&gt;B&lt;/option&gt;
               &lt;option value = 'BMINUS'&gt;B-&lt;/option&gt;
               &lt;option value = 'CPLUS'&gt;C+ &lt;/option&gt;
               &lt;option value = 'C'&gt;C&lt;/option&gt;
               &lt;option value = 'CMINUS'&gt;C-&lt;/option&gt;
               &lt;option value = 'DPLUS'&gt;D+ &lt;/option&gt;
               &lt;option value = 'D'&gt;D&lt;/option&gt;
               &lt;option value = 'DMINUS'&gt;D-&lt;/option&gt;
               &lt;option value ='F'&gt;F&lt;/option&gt;
         &lt;/select&gt;
        &lt;/td&gt;
       &lt;/tr&gt;
  
     &lt;/table&gt;
     &lt;input type = 'submit' value = 'Submit'/&gt;
  &lt;/form&gt;
  </code></pre>