JSFiddle - React, Tailwind, and code Playground

HTML

<body>

  <div id='a'>
    Click ME from mouse and touch device
  </div>
  <div id='b'class='output'>
  
  </div>
  <style>
    div#a {
      width: 100px;
      height: 100px;
      background: black;
      display: inline-block;
      vertical-align: top;
      user-select: none;
      color: white;
    }
    div#b {
      display: inline-block;
      width: 200px;
      height: 300px;
      margin-left: 20px;
      overflow: hidden;
      }
    

  </style>

</body>

JavaScript

document.getElementById("a").addEventListener("touchstart", function(e) {
  document.getElementsByClassName("output")[0].innerText =  "\n touchstart " +
  document.getElementsByClassName("output")[0].innerText;
  e.preventDefault();
});

document.getElementById("a").addEventListener("mousedown", function() {
  document.getElementsByClassName("output")[0].innerText =
  " \n mousedown " + document.getElementsByClassName("output")[0].innerText;
});