<div class="flex">
  <div id="promo-1" class="block ma">ПРИМЕР 1</div>
  <div id="promo-2" class="block ma">ПРИМЕР 2</div>
  <div id="promo-3" class="block ma">ПРИМЕР 3</div>
</div>

<div class="flex">
  <button class="ma" onclick="var1()">Hide 1</button>
  <button class="ma" onclick="var2()">Hide 2</button>
  <button class="ma" onclick="var3()">Hide 3</button>  
</div>
.block {
  background: blue;
  width: 100px;
  height: 100px;
  display: show;
}
.flex {
  display:flex;
}

.ma {
  margin: auto;
}
function var1() {
  const id = 1
  const skidka = document.getElementById("promo-"+id);
  setTimeout(function () {
    skidka.setAttribute("style", "display: none;");
  }, 150);
}

function var2() {
  const id = 2
  const skidka2 = document.getElementById("promo-"+id);
  setTimeout(() => {
    skidka2.setAttribute("style", "display: none;");
  }, 150);
}

function var3() {
  const id = 3
  const skidka3 = document.getElementById("promo-"+id);
  setTimeout(function (arg) {
    arg.setAttribute("style", "display: none;");
  }, 150, skidka3);
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

  1. https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js