JSFiddle - React, Tailwind, and code Playground

HTML

<ul>
    <li>menu 1</li>
    <li>menu 2</li>
    <li>menu 3</li>
    <li>menu 4</li>
</ul>

CSS

ul {
  position: relative;
}

li {
  position: relative;
  display: inline-block;
  cursor: pointer;
  border: 3px solid red;
  margin: 2px;
  padding: 5px;
}

.removed {
  transition: all 0.5s ease-out;
  opacity: 0;
}

JavaScript

// jQuery transitionRemove plugin
(function($) {
    $.fn.transitionRemove = function(transitionClass, selector) {
        $(this).addClass(transitionClass).on('transitionend', function() {
            $(this).remove(selector);
        });
    };
})(jQuery);

// demo
$('li').click(function() {
    $(this).transitionRemove('removed');
});