title: Jquery - After .append, .hover on other element not working
body: <p>I wrote a bit of code to handle the insertion of a comment via AJAX.
  Once you have entered the comment, having received the HTML from the server and use <code>.append()</code> to insert it into the DOM, does not seem to be handled the event <code>.hover()</code> for the new item.</p>
  
  <p><strong>There is the code:</strong></p>
  
  <pre><code>/**
   * This code manage insert comment with ajax
   **/
  
  $(document).ready(function() 
  {
      $('form[id^=insert_comment_for_product_]').submit(function (event)
      {
          event.preventDefault();
  
          var productId = $(this).attr('id');
          var productIdClear = productId.substr(productId.lastIndexOf('_', 0) - 1, productId.length);
  
          var textarea = $('#' + $(this).attr('id') + ' textarea').val();
          var textareaId = $('#' + $(this).attr('id') + ' textarea').attr('id');
          var token = $('#' + $(this).attr('id') + ' input#user_comment_product__token').val();
  
          var gif = $(this).parent('div').children('img.insert_comment_img');
          $(gif).show();
  
          $.post($(this).attr('action'),
          {
              'id': productIdClear.toString(),
              'user_comment_product[comment]': textarea,
              'user_comment_product[_token]' : token
          },
          function(data) 
          {
              $('div.product_comment&gt;div').append(data);
              $('#' + textareaId).val(' ');
              $(gif).hide();
          });
  
      });
     /**
      * This is the function that no work afert .append()
      **/
  
  
      $('div.comment[id^=comment_]').hover(function()
      {
          var commentId = $(this).attr('id');
  
          $('#' + commentId + ' img.comment_delete').show();
  
          $('#' + commentId + ' img.comment_delete').click(function(event)
          {
              event.stopImmediatePropagation();
              commentId = commentId.substr(commentId.lastIndexOf('_') + 1, commentId.length);
  
              $.post("../../../user/comment/delete",
              {
                  'id': commentId.toString()
              },
              function(data) 
              {
                  if(data.responseCode == 200)
                  {
                      $('div#comment_' + commentId).hide();
                  }
              });
          })
  
      },
      function ()
      {
          var commentId = $(this).attr('id');
  
          $('#' + commentId + ' img.comment_delete').hide();
      });
  });
  </code></pre>
  
  <p><strong>WHY?</strong></p>