JSFiddle - React, Tailwind, and code Playground

by salomvary

HTML

<a id="bottom" href="http://example.com">
</a>
<a id="top" href="#">
</a>
<pre id="log">
</pre>

CSS

#top {
    background-color: red;
}
#bottom {
    background-color: blue;
}
a {
    position: absolute;
    width: 100px;
    height: 100px;
    display:block; 
    left: 200px;
}

JavaScript

var log = document.getElementById('log');

$('#top').click(function(e) {
    event.preventDefault();
    $(this).hide();
});
$('#bottom').click(function() {
   log.innerHTML += 'clicked!\n';
});
$('#bottom').on('mouseenter', function() {
   log.innerHTML += 'mouseenter!\n';
});