JSFiddle - React, Tailwind, and code Playground

by Stafox

HTML

<div>
<a href="http://google.com/" target="_blank">Gooooogle</a>
</div>
<p>
    
</p>

CSS

div {
    width: 300px;
    height: 100px;
    color: #fff;
    background: #85144B;
    border: 1px solid #111;
}
p span {
    display: block;
}
div a {
    color: #FFDC00;
    text-align: center;
    display: block;
    line-height: 100px;
}

JavaScript

$('a').on('click', function(e){
    e.preventDefault();
    $('p').append('<span>clicked</span>');
    if(e.isDefaultPrevented()) {
        $('p').append('<span>prevented '+$(e.target).attr('href')+'</span>');
        window.location = $(e.target).attr('href'); // resume prevented
    }
});