jquery - Cant get my added div removed -

i added elements page following code, works fine:

$("body").on("click", "#buttonadd", function(){     var vriend = "<div id='friends'><h4>jaap smit</h4><div class='unfollow'><a href='#' class='removefriend'>delete friend</a></div></div>";     $(this).parent().siblings(".currentfriends").append(vriend); }); 

however when try remove using following code, nothing happen...

$("body").on("click", "a.removefriend", function(){     $(this).closest('.vriend').remove(); });    

been trying quite time have no idea how fix it. ideas?

there nothing class vriend. may want remove #friends.

$("body").on("click", "a.removefriend", function(){     $(this).closest('#friends').remove(); });