JSFiddle - React, Tailwind, and code Playground
HTML
<button class="js-delete">Delete</button>
CSS
.js-delete {
-webkit-transition: width .3s;
transition: width .3s;
width: 100px;
}
.js-delete:hover {
width: 100%;
}
JavaScript
var clickHandler = function(e) {
event(e, trigger);
}
document.querySelector('.js-delete').addEventListener('click',clickHandler );
function event(e, callback) {
e.target.addEventListener('transitionend', function(e) {
e.target.removeEventListener(e.type, arguments.callee);
callback(e);
});
}
function trigger(e) {
alert("DONE");
e.target.removeEventListener(e.type, clickHandler);
}