title: jQuery: Append html and update DOM
body: <p>I have this function:</p>
  
  <pre><code>$(document).on('scroll', function(e)
  {
    if (processing)
       return false;
  
    if ($(window).scrollTop() &gt;= ($(document).height() - $(window).height())*0.9)
    {
       processing = true;
  
       var resource = $('#lazyLoad').attr('href');
  
       $.get(resource, '', function(data)
       {
          $('#lazyLoad').remove();
  
          $('#content').append(data);
  
          step++;
          processing = false;
       });
    }
  });
  </code></pre>
  
  <p>I add some html code to my page every time this function is called. But other Javascript functions are not triggered when I click on a newly added html button. So I guess the DOM-element was not porper updated. But how do I proper update the DOM-element?</p>
  
  <p>My Handler looks like this:</p>
  
  <pre><code>$('.article_action.un_read').on('click', function(event)
  {
    event.preventDefault();
  
    var resource = $(this).attr('href');
    var elElemente = $(this);
  
    $.get(resource, '', function(data)
    {
       var obj = $.parseJSON(data);
  
       if(obj.status == 1)
          elElemente.html('&amp;#128213;');
       else
          elElemente.html('&amp;#128214;');
    });
  });
  </code></pre>
  
  <p>So it also uses the <code>on</code> function. </p>