Question: ```
  $("#btnAdd").click(function () {
    $.ajax({
      type: "POST",
      url: "View.aspx/AddResponsibility",
      data: '{"ClientCode":"' + $("#hfClientCode").val() + '","ResponsibilityCode":"' + $("#txtResponsibility").val() + '"}',
      async: true,
      contentType: "application/json; charset=utf-8",
      dataType: "json",
      success: function (msg) {
        $('#tblRespon > tbody:last').append("<tr><td>" + $("#txtResponsibility").val() + "</td><td>" + $("#txtFullName").val() + "</td><td><a class='delete' id='btnDelete' name='btnDelete' value='" + $("#txtResponsibility").val() + "'>" + "Delete" + "</a></td></tr>");
      },
      error: function (msg) {
        alert(msg.d);
      }
    });
  });

```

I need to add a class to the '< a>' that is a new element I am adding. The way I've attempted above does not appear to be working as the function 

```
$(".delete").click(function () {

```

does not fire as it does usually with an element already contained on the page.

Answer: 
You need to use [.on()](http://api.jquery.com/on/) function like this:

```
$("#tblRespon").on("click",".delete",function(){

```
If I am correct, you need to reasign the *remove* handler to the added elements:

```
success: function (msg) {
        $('#tblRespon > tbody:last').append("<tr><td>" + $("#txtResponsibility").val() + "</td><td>" + $("#txtFullName").val() + "</td><td><a class='delete' id='btnDelete' name='btnDelete' value='" + $("#txtResponsibility").val() + "'>" + "Delete" + "</a></td></tr>");

        $('.delete').click(function(){
           //your code
        })

},

```

I know that there are better ways, but just need to know that every time you added elements you should registers the handlers for those added elements