Problems creating close me link in javascript bookmarklet

Question

I am trying to add a close me link to this function. The way this works, is you paste all of this code without newline characters into a bookmark and the bookmark brings up a blue box on the screen.

Here is what I have so far, the close me link I have created is the "eleCloseLink" node I created:

javascript:(
  function(){

var pagebody = document.evaluate( '/html/body' ,document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null ).singleNodeValue;
if (pagebody != null) {
  var node = document.createElement("DIV");
   node.style.position="fixed";
   node.style.color="white";
   node.style.background="blue";
   node.style.width="350px";
   node.style.top="50px";
   node.innerHTML = "<br>BLUE BOX<br>2<br>";

   var box = pagebody.appendChild(node);

   /* Creating close link here */
   var eleCloseLink = document.createElement("a");
   eleCloseLink.setAttribute('href', 'javascript:( function(){ node.parentNode.removeChild(node); })();');
   eleCloseLink.innerHTML = 'close me';
   box.appendChild(eleCloseLink);

}

})();

So far I have tried doing this about 10 differen't ways and none have succeeded. The most recent way is putting javascript:( function(){ node.parentNode.removeChild(node); })(); inside of a and that is not working either. I feel like this should be one of the most common things to code as I see them on websites often and therefore there should be a lot of information on it. My scenario may be a little more specific than most b/c the box I am creating is just a DIV element and I am essentially trying to delete the DIV element (i have tried using this as well) with my close me link. Please let me know if anyone has any suggestions on how to create this close me link.

Answer 1

To resolve this, I created a click event listener which called a function that removes the object. To accompany this, I added a id attribute to the DIV object I was trying to remove. When the click event is triggered, the close function then evaluates the div object with XPATH referencing by id attribute. I was then able to run a remove() method on that object.

End Snippet:

   /*Create Link in box to close box*/
   var eleCloseLink = document.createElement("a");

   eleCloseLink.innerHTML = '|CLOSE|';
   eleCloseLink.addEventListener("click", CloseBox, false);
   eleCloseLink.background = 'red';
   box.appendChild(eleCloseLink);
 }

 /*Function to close the box */
 function CloseBox() {
    document.evaluate( "//*[@id='thebox']" ,document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null ).singleNodeValue.remove(this);
 }

Still not completely sure if I had to use "this" or not in the remove() method as I was calling the remove() method on the object itself. However this is now working.