JSFiddle - React, Tailwind, and code Playground

HTML

<span> the span <a onclick="alert('onclick HTML attritbute fired!')" href="http://www.href-attribute-fired.com">the link</a> wraps the link</span>

CSS

span {display: inline-block; padding: 30px; background: #ffc; border: 1px solid #ff3}
a {display: inline-block; padding: 10px; background: #cff; border: 1px solid #3ff}

JavaScript

$('a').click(function(){
    alert("jQuery click fired!");
});

$('span').live("click", function(){
    alert('(span clicked, let us see what other events fire...)');
    $(this).find('a').click();
});

// also tried on() and off():
//$('span').on("click", function(){
//    alert('(span clicked, let us see what other events fire...)');
//    $(this).off("click");
//    $(this).find('a').click();
//});