title: jquery change something added by jquery
body: <p>i have a problem with onchange event in jquery. 
  the event added dont work</p>
  
  <p>This is my code:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>&lt;script&gt;
      
      jQuery("#select1").on('change',
              function(event)
              {       
                event.preventDefault();  
                 jQuery.ajax({
                      type:'POST',
                      async: true,
                      cache: false,
                      url: '&lt;?php echo Router::Url(array('controller' =&gt; 'XXX','admin' =&gt; TRUE, 'action' =&gt; 'onChangeSelect1Ajax'), TRUE); ?&gt;',
                      success: function(response) {
                          
                          jQuery('#select2Position').empty().append(response);
                        
                      },
                    error: function(response) { 
                        
                      alert('error');  
                      },
                      data:{ idselect1 : this.value }
                  });
                  return false;
   
              }
      );
  
  
      jQuery("#select2").on('change',
              function(event)
              {       
                event.preventDefault();    
                 jQuery.ajax({
                      type:'POST',
                      async: true,
                      cache: false,
                      url: '&lt;?php echo Router::Url(array('controller' =&gt; 'XXX','admin' =&gt; TRUE, 'action' =&gt; 'onChangeSelect12Ajax'), TRUE); ?&gt;',
                      success: function(response) {
                          
                          jQuery('#other').empty().append(response);
                        
                      },
                    error: function(response) { 
                        
                      alert('error');  
                      },
                      data:{ idselect1 : jQuery("#select1").value, idselect2 : this.value }
                  });
                  return false;
   
              }
      );
  
  
  &lt;/script&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>When i'm change select1, select2 is added. 
  but select2 onchange event dont working.
  could you help me please?</p>
  
  <p>thanks</p>