JSFiddle - React, Tailwind, and code Playground

HTML

<div class="myBlocks">
  <div class="block">
    Текст 1<div class="close">x</div>
  </div>

  <div class="block">
    Текст 2<div class="close">x</div>
  </div>

  <div class="block">
    Текст 3<div class="close">x</div>
  </div>

  <div class="block hidden">
    Текст 4<div class="close">x</div>
  </div>

  <div class="block hidden">
    Текст 5<div class="close">x</div>
  </div>
</div>

CSS

.hidden {
  display: none;
}
.block {
  background: #cfcfff;
  width: 5em;
  height: 3em;
  margin: 1em;
  float: left;
}
.block .close {
  cursor: pointer;
  float: right;
  margin: 2px;
  border: solid 1px gray;
  padding: 2px 6px;
}

JavaScript

$('.myBlocks').on('click', '.block .close', function(){
  var clicked = $(this).closest('.block') // блок который прячется
  var next = clicked.nextAll('.block:hidden:first') // следующий скрытый

  clicked.addClass('hidden');
  next.removeClass('hidden'); 
})