title: Detect dynamically added elements jQuery
body: <p>I have a button which is added dynamically</p>
  
  <pre><code>    &lt;button id="btnSubmit"&gt;Button 1&lt;/button&gt;
  
      $(document).ready(function(){
      $('#btnSubmit').on('click', function(){
          alert('Button 1');
          var button2 = '&lt;button id="btn2" &gt;Button 2&lt;/button&gt;';
          $('#btnSubmit').after('&lt;p&gt;&lt;/p&gt;' + button2);
      });
  
      $(document).on('#btn2', 'click', function(){
          alert('Button2 clicked');
      });
    });
  </code></pre>
  
  <p>Now, when I click on #btn2 the event is not detected. How can this be fixed?</p>