JSFiddle - React, Tailwind, and code Playground
HTML
<div></div>
<div></div>
<div></div>
CSS
div {
width: 100px;
height: 100px;
margin: 5px;
background: blue;
opacity: 1;
transition: opacity 1s;
}
div.fade-out {
opacity: 0;
}
JavaScript
document.addEventListener('click', function (event) {
fadeOutAndRemove(event.target);
});
function fadeOutAndRemove(element) {
element.classList.add('fade-out');
element.addEventListener('transitionend', function () {
element.parentNode.removeChild(element);
});
}