JSFiddle - React, Tailwind, and code Playground

by John Schulz

HTML

<span class="block"><a id="google" href="http://google.com">Google</a></span>
<span class="block"><a id="bing" href="http://bing.com">B!ng</a></span>
<span class="block"><a id="yahoo" href="http://yahoo.com">Yahoo!</a></span>

CSS

.block {
    margin: 1em; 
    padding: 2em;
    border: 1px solid black;
    float: left;
}

.block:hover { background-color: #0c0 }

JavaScript

jQuery(function ($){
    
    var proxied = $.proxy(handler, this);
    
    $('a')
        .bind('click', handler)
        .bind('click', proxied)
    $('.block').bind('click', handler);
});

function handler(e)
{    
    e.preventDefault();
    console.log('this', this, 'target', e.target);
}