JSFiddle - React, Tailwind, and code Playground

by Ayyappan Sakthivadivel

HTML

<p>The content of the body element is displayed in your browser.</p>
<div>
  <span class="second" value="yes">Attributes List - Hover Me</span>
  <span class="first">My Content</span>
</div>
<div>

  <span class="second" value="no">Attributes List - Hover Me</span>
  <span class="first">My Content</span>
</div>

CSS

div {
  display: flex;
  flex-direction: row-reverse;
  justify-content: flex-end;
}

span {
  padding: 0 1em;
}

.second:hover + .first {
  background:lightblue;
}