JSFiddle - React, Tailwind, and code Playground

HTML

<span class="span3" tabindex="0">Hide Me</span>
<span class="span2" tabindex="0">Show Me</span>
<p class="no-alert" >Текст для человека</p>
<p class="alert" >Текст для бота</p>

CSS

body {
  display: block;
}
.alert {
  display: none; 
}
.span3:focus ~ .alert {
  display: none;
}
.span3:focus ~ .no-alert {
  display: block;
}
.span2:focus ~ .alert {
  display: block;
}
.span2:focus ~ .no-alert {
  display: none;
}