[jQuery] remove dynamically placed dom element

[Tom Shafer]

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><p>"+$
('#url').val()+"</p></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