[jQuery] remove dynamically placed dom element
I am using this code to add a new item to a list
$("#addLinks").submit(function()
{
$.post("addLinks.php",{ step:'addLink',title:$
('#title').val(),url:$('#url').val(),pageID:$('#pageID').val()} ,
function(data)
{
$('#'+$('#pageID').val()).
append("<li id='link_'"+data+"><a href='javascript://'
id='delete' onclick='deleteitem("+data+"); return false;'><img
src='img/delete.gif' /></a><h1>"+$('#title').val()+"</h1>"+$
('#url').val()+"
</li>");
$('#link_'+data).effect("pulsate", { times: 3 }, 1000);
});
return false;
});
as you can see i am adding <a href='javascript://' id='delete'
onclick='deleteitem("+data+"); return false;'><img src='img/
delete.gif' /></a>
to delete the newest dom element.
this works on page refresh but I would like it to work right after
someone added the dom element
here is what i am using to delete data from the database and the
element that goes along with the delete item
function deleteitem(id) {
$(function() {
$.post("addLinks.php",{ step:'deleteLink',linkId:+id});
$('#link_'+id).remove();
});
}
$('#link_'+id).remove(); removes the item after a page refresh. How
can it the element be removed without a page refresh after being added
thanks
-tom