title: jQuery not working for dynamically created input field
body: <p>I have script, that on press of Enter on keyboard hides $this input and generates span with value of that field to display.</p>
  
  <pre><code>    $('.work_experience .achievements').on('keypress','input', function(event){
      if (!$(this).val() &amp;&amp; event.which == 13 ) {
          alert('Input something');
          event.preventDefault();
      }
      else if (event.which == 13) {
          event.preventDefault();
          var value = $(this).val();
          $(this).parent().append('&lt;span&gt;&lt;i class="fa fa-times"&gt;&lt;/i&gt; ' + value + '&lt;/span&gt;&lt;input type="text" class="form-control input-xs" placeholder="I did" autofocus&gt;');
          $(this).css('display', 'none');
          $('.achievements input:last-child').focus();
      }
  });
  </code></pre>
  
  <p>It works. But then I have button, clicking on which generates new input field. And on that, newly created input, script doesn't work anymore. Help is appreciated.</p>
  
  <p><strong>PS</strong> Script adding new set of fields</p>
  
  <pre><code>    $('.form_fields').on('click','#add_work', function(event){
      event.preventDefault();
      var field_set = '&lt;div class="form-group work_experience"&gt;'+                            
                      '&lt;input type="text" class="form-control input-m" id="company_name" placeholder="Company name"&gt;'+
                      '&lt;input type="text" class="form-control input-m" id="company_place" placeholder="Company location"&gt;'+
                      '&lt;input type="text" class="form-control input-m" id="work_period_start" placeholder="Beginnig"&gt;'+
                      '&lt;input type="text" class="form-control input-m" id="work_period_end" placeholder="End"&gt;'+
                      '&lt;label&gt;&lt;input type="checkbox"&gt; Currently&lt;/label&gt;'+
                      '&lt;textarea class="form-control" rows="5" placeholder="Write a few sentences about that company"&gt;&lt;/textarea&gt;'+
                      '&lt;input type="text" class="form-control input-m" placeholder="Your position"&gt;'+
                      '&lt;label&gt;&lt;strong&gt;Achievements&lt;/strong&gt;&lt;/label&gt;'+
                      '&lt;div class="achievements"&gt;'+
                      '&lt;input type="text" class="form-control input-xs" placeholder="I did"&gt;'+
                      '&lt;/div&gt;'+
                  '&lt;/div&gt;';
      $(this).prev().after(field_set);
  });
  </code></pre>