why wont jQuery remove() work in this case?

Question

Im trying to cause a canvas element to be added to the DOM and then removed after a set time. The killbox() function gets called, but the element is not removed. I believe I have the syntax right, and that there is some underlying issue with removing dynamically added DOM elements.

//con is short for console.log()

function spawnCanvas(e) {
   con(e);
   var boxheight=50;
   var boxwidth=50;   
   var xpos = e.clientX - boxwidth/2;
   var ypos = e.clientY - boxheight/2;
   var id = xpos.toString() + ypos.toString();
   con("id:" + id);
   var tag = "<canvas width='" + boxwidth +
             "' height='" + boxheight +
             "' style='position:absolute; border:1px solid #000; left:" + 
             xpos + "px; top:" + ypos + "px;' id='" + id + "'></canvas>";
   con(tag);
   var t = $(tag);
   $("body").append(t);
   var p = setTimeout("killbox(" + id + ")", 1500);


}


function killbox(id){
    con("in killbox. id:" + id);
    $('#id').remove();

}

Answer 1

Within killbox you are removing the element with the literal id id. Instead try;

$('#' + id).remove();

The above will remove the element that has the id that the "id" variable is set to.

Answer 2

Are you sure you don't want $("#" + id).remove();?

Answer 3

because you are searching with an element with the ID id, but you rather wanted to pass the parameter from the function

function killbox(id){
    con("in killbox. id:" + id);
    $('#'+id).remove();

}