javascript - Removing DIV Element before adding it

Question

I want to display an transparent DIV that contains some route information. This DIV should get displayed whenever the user clicks a "show route button". The DIV is adding just fine, butwhen the user clicks this button again (on another marker) another DIV shows up.

This is my code so far which works, up untill the removal. I feel it has something to do with a) the selector not matching, but when I inspect the DOM in Firebug, there clearly is a DIV with that id

function displayRouteInfo(duration, distance){
    removeInfoWindow(function(){
        // TODO: remove overlay again
        routeInfoWindow = jQuery('<div id="routeInfoWindow" style="color:white;"> <p><span style="margin:10px;"> Routeinformation <span style="margin:10px;"> Dauer: '
                    +duration+'<span style="margin:10px;"> Entfernung: '+distance+'</p> </span></div>');
        routeInfoWindow.appendTo(document.body);
        }
    );
}


function removeInfoWindow(callback){
    $('routeInfoWindow').remove();
    callback.call();
}

Thanks for any input and advice to solve this.

Answer 1

您的选择器不正确，您错过了#for ID 选择器。

$('#routeInfoWindow').remove();