JSFiddle - React, Tailwind, and code Playground

HTML

<ul id='ulid'>
    <li>Task1</li>
    <li>Task2</li>
<li>Task3</li>
<li>Task4</li>
<li>Task5</li>
<li>Task6</li>
    <li>Task7</li>
</ul>

<div id="show_details"></div>

CSS

#ulid li {
    width: 0;
}

JavaScript

//$("#ulid li").wrapInner('<span>');
$('ul#ulid li').hover(function() {
    $('#show_details').html($(this).text());
}, function() {
    $('#show_details').html('');
});