JSFiddle - React, Tailwind, and code Playground

by werty1001

HTML

<a data-help="log1">Ссылка №1</a>
<a data-help="log2">Ссылка №2</a> <br /><br />

<div id="log1" class="help">Блок 1</div>
<div id="log2" class="help">Блок 2</div>

CSS

a {color: blue;border-bottom: dotted 1px blue;margin: 0 10px;}
a:hover {color:#333;border-color:#333;cursor:pointer;}
.help {width: 100px;height:100px;display:inline-block;background: #eee;padding: 20px;margin: 0 10px;opacity:0;}
.help.active {opacity: 1;}

JavaScript

$("body").on("mouseenter", "[data-help]", function () {
    $(".help").removeClass("active");
    $("#"+$(this).data("help")+"").addClass("active");
});