無法刪除Jquery中最後添加的元素

Question

我用append()方法追加數據，我用remove()刪除每個元素。但是，我無法刪除列表中的最後一個元素。

$(document).ready(function() { 
    $(".add_cart").click(function() { 
     var id = this.id; 
     $(this).prop("disabled", true); 
     $(this).val("Item Already in Cart"); 
     $.get("cart.php", { 
      "id": id 
     }, function (data) { 
      $("#sam").append("<table class='tables'><tr><td>" + data + "</td><td><input class='remove' id='" + id + "' type='button' value='Remove'></td></tr></table>"); 
     }); 
     $(".tables").click(function() { 
      $(this).remove() 
     }); 
    }); 
}); 

Answer 1

您可以使用last-child。

我認爲，你婉刪除最後一個元素，當你點擊.tables元素，

$(document).ready(function() { 
    $(".add_cart").click(function() { 
     var id = this.id; 
     $(this).prop("disabled", true); 
     $(this).val("Item Already in Cart"); 
      $("#sam").append("<table class='tables'><tr><td>dasdasdas</td><td><input class='remove' id='3' type='button' value='Remove1'></td></tr><tr><td>dasdasdas</td><td><input class='remove' id='4' type='button' value='Remove4'></td></tr><tr><td>dasdasdas</td><td><input class='remove' id='5' type='button' value='Remove5'></td></tr></table>"); 
      $(".tables").click(function() { 
       $(".tables tr:last-child").remove() 
      }); 
    }); 
}); 

這裏是工作提琴：http://jsfiddle.net/8c9NZ/

如果你想刪除的每個點擊的元素，你可以使用;

$(document).ready(function() { 
    $(".add_cart").click(function() { 
     var id = this.id; 
     $(this).prop("disabled", true); 
     $(this).val("Item Already in Cart"); 
      $("#sam").append("<table class='tables'><tr><td>dasdasdas</td><td><input class='remove' id='3' type='button' value='Remove1'></td></tr><tr><td>dasdasdas</td><td><input class='remove' id='4' type='button' value='Remove4'></td></tr><tr><td>dasdasdas</td><td><input class='remove' id='5' type='button' value='Remove5'></td></tr></table>"); 
      $(".remove").click(function() { 
       $(this).closest('tr').remove() 
      }); 
    }); 
}); 

這裏是工作提琴：http://jsfiddle.net/xyQtU/1/

Answer 2

若要從列表中刪除最後一個元素使用：

$(selectAllListElements).last().remove(); 

Answer 3

嘗試改變：

$(".tables").click(function() { 
      $(this).remove() 
     }); 

有：

$(".tables").on('click' , function() { 
     $(this).remove() 
    });