JSFiddle - React, Tailwind, and code Playground

by ZEZEME

HTML

<ul>
    <li class="clickable" data-desc="bar and stuff">Fo</li>
    <li class="clickable" data-desc="a red fruit">apples</li>
    <li class="clickable" data-desc="thing you type with">keyboard</li>
    <li class="clickable" data-desc="floats on water">boat</li>
</ul>
<div id="content">Descriptions should appear here</div>

CSS

.clickable {
    cursor:pointer;
}

JavaScript

$('.clickable').on('hover', function () {
    desc = $(this).attr('data-desc'); //get the description
    $('#content').text(desc);
});