jQuery-附加到表的链接不起作用

Question

Hey guys I have some jquery code that adds a row to a table with a link to remove it and return it back to the select. Here's the code:

$('#addUser').on('click', function (e) {
    var selectedUser = $('#Utilizadores option:selected').text();
    $('#tabela > tbody:last').append('<tr id="'+selectedUser+'"><td>' + selectedUser + '</td><td><a id="removeUser" href="#" class="btn btn-default btn-xs"><i class="glyphicon glyphicon-remove"></i></a></td></tr>');
    $("#Utilizadores option[value='" + selectedUser + "']").remove();
    e.preventDefault();
});

It works! But now I want to do the reverse action of this. So I was just tying it out and not even the alert goes off. Here's the remove code:

$('#removeUser').on('click', function (e) {
    alert('teste');
    e.preventDefault();
});

The same id I gave to the <a> tag but still nothing gets called. I inspect the element and the id is corret and everything.

Does anyone know what the problem is?

Answer 1

To anyone who stumbles here and doesn't see the warning above!

You can check a Question for the same problem here

Answer 2

Try using the live() method

$('#removeUser').live('click', function (e) {
    alert('teste');
    e.preventDefault();
});