function msgBox() {
    var cover = document.createElement("div");
    cover.setAttribute("id", "message-cover");  // give the <div> an ID
    cover.onclick = function() { killMsgBox(); };  // add onclick event to hide <div>
    document.body.appendChild(cover);  // append element to DOM

function killMsgBox() {
    var element = document.getElementById("message-cover");
    element.detachEvent("onclick", killMsgBox);  // get rid of onclick event
    element.parentNode.removeChild(element);  // remove element from DOM
#message-cover {
    background-color: rgb(0, 0, 0);
    opacity: .5;
    filter: alpha(opacity=50); /* for IE */
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
<button type="button" onclick="msgBox();">Message Box</button>
every time i click to create the msgBox() about 9MB of memory is piled onto IE. at first, i thought it might be the contents inside the <div> weren't being destroyed properly, but when i set up the function to just display the <div> by itself - i got the same issue.

any ideas on what can be done, if anything, in IE to fix this problem? typically this wouldn't be an issue, but my users are going to be opening up these transparent boxes often and the memory will add up quick.