How to update/refresh DOM item after insert jQuery

Question

I try to figure out how to update the element LI after use insertBefore function jQuery.

The problem is after add any new elements to UL, I can not delete the element sa

Answer 1

You'd need to use event delegation for this, due to the elements being added/removed dynamically:

 $('.content').on('click', '.emailTagRemove', function () {                
      var email = $(this).parents("li");
      email.remove();
 });

Use .content as the selector as it's more efficient than using document in this case.

jsFiddle here

Answer 2

Because those are dynamically added elements to the existing HTML, so you need to delegate it using on event handler attachment with the document.

$(document).on('click','.emailTagRemove', function () {                
                var email = $(this).parents("li");
                email.remove();
            });

JSFiddle

As @null pointed using the static selector instead of document is good, in order to avoid conflict among those elements in entire code.

$('#ulEmailsCotacao').on('click','.emailTagRemove', function () {                
                var email = $(this).parents("li");
                email.remove();
            });

JSFiddle