JSFiddle - React, Tailwind, and code Playground

HTML

<li id="detail">
  <a href="#" class="detail-report">
    <span>Detailed Report</span>
  </a>
</li>
<li id="product">
  <a href="#" class="product-report">
    <span>Product Area Report</span>
  </a>
</li>

JavaScript

$(".detail-report").onchange(function(e) {
          e.preventDefault();
          alert("clicked on the detail report");
        });

        $(".product-report").click(function(e) {
          e.preventDefault();
          alert("clicked on the product report");
        });