I have an element that is added using javascript to my HTML document. I am trying to remove it when I click on that same element. I do not know the id of the element yet, I have just included a sample id for now.

I have already tried looking at this answer here (Creating an element that can remove it self?) and tried using the method provided here (Javascript: How to make a Control send itself in a method) as well to reference the element but have had no luck.

Here is what I have so far.

function remove() {

  var element = this.id;

  //I have also tried using document.getElementByID(this.id)

  element.remove();

  //I have also tried using element.parentNode.removeChild(element); to remove the element.

}

<div id=i onclick=remove(this)>Sample text</div>

I am not sure what I am doing wrong but this is the error I keep getting.

Uncaught TypeError: Cannot read property 'remove' of undefined