JSFiddle - React, Tailwind, and code Playground

HTML

<ul class="listItems">
 <li>I am list one</li>
 <li>I am list two</li>
 <li>I am list three</li>
 <li>I am list four</li>
</ul>

<ul id="context-menu">
<li> Edit </li>
<li> Delete </li>
</ul>

CSS

#context-menu {
  display: none;
  position: absolute;
  color: blue;
}
.listItems li {
  padding-bottom: 25px;
}

JavaScript

document.addEventListener('contextmenu', function(e) {
e.preventDefault();
var x = e.offsetX;
var y = e.offsetY;
var d = document.getElementById("context-menu");
d.style.display = "block";
d.style.left = x+'px';
d.style.top = y+'px';
console.log(x,y);
}, false);