JSFiddle - React, Tailwind, and code Playground

HTML

<ul class="kundenList">
    <li>
        <img src="t3.png" class="kundenImg" />
        <div class="blacklayer" style="opacity: 0;"></div>
        <div class="description">
            <h3>Title</h3>
            <p>Description</p>
        </div>
    </li>
</ul>

JavaScript

$(".kundenList li").live("mouseenter", function(){
    var $this = $(this);
    if ($this.children().size() > 0) {
        
        $this.data('timeout', setTimeout( function () {
            $this.children("div.description").css({opacity: '0'});

            $this.children("div.blacklayer").animate({
                opacity: '0.85'
            }, 3);

            $this.children("div.description").animate({
                top: "-=200px",
                opacity: '1'
            }, 300).css( 'cursor', 'pointer' );

            $this.addClass("activeLI");
        }, 300));
    }
});