JSFiddle - React, Tailwind, and code Playground

HTML

<div id="container">
<a href="#" class="js-test" data-events="click">Test 1</a>
<a href="#" class="js-test" data-events="mouseover">Test 2</a>
</div>

<button>+2 items</button>

JavaScript

$(document).ready(function() {
      $('.js-test').each(function() { 
          var _that = this;
          alert($(_that).attr("data-events"));

          $(this).parent().on(
              $(_that).attr("data-events"), 
                  '.js-test[data-events="'+ $(_that).attr("data-events") +'"]', 
                  function() {
     
                      // event pulled from data-events attribute           
                      alert("hello - this event was triggered by the " + $(_that).attr("data-events") + " action.");
                  }
              );
          }); 

       $('button').click(function() {

           $('#container')
    .append("<a href='#' class='js-test' data-events='mouseover'>Test 3</a>");
           
           $('#container')
    .append("<a href='#' class='js-test' data-events='click'>Test 4</a>");
       });
       
    });