Toggle hidden content on button click

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<div class="fake-button" data-target="#poka12">
  Przypominajka
  <span class="glyphicon glyphicon-chevron-right" style="float: right"></span>
</div>
<div id="poka12" class="poka">
  <div class="poka__container">.......</div>
</div>
<div class="fake-button" data-target="#poka11">
  Przypominajka
  <span class="glyphicon glyphicon-chevron-right" style="float: right"></span>
</div>
<div id="poka11" class="poka">
  <div class="poka__container">.......</div>
</div>

CSS

.fake-button {
  margin: 5px 5px 5px 5px;
  border-radius: 5px;
  background-color: #009999;
  font-size: 25px;
  color: yellow;
  font-weight: bold;
  padding: 25px 25px 25px 25px;
  cursor: pointer;
}

.poka {
  display: none;
}

JavaScript

$(document)
  .find(".fake-button")
  .on("click", function () {
  	const duration = "slow"
    const id = $(this).data("target");
    const $target = $(document).find(id)
    const $pokas = $(document).find(".poka").not(id)
    
    $pokas.slideUp(duration)
    $target.is(":visible") ? $target.slideUp(duration) : $target.slideDown(duration)
  })