Как исправить syntaxerror identifier 'btn' has already been declared в моём случае?

Question

[VPVPVP]

В двух словах.
Есть товары на странице,у них одинаковые div итд итп.. В div данного товара ,есть скрытый div с инормацией.
Я пытался сделать чтоб при клике на кнопку -

открылся скрытый DIV

Всё грубо говоря работает,в первом товаре,в других вылазит ошибка syntaxerror identifier 'btn' has already been declared что в целом логично,но в js не шарю,по этому незнаю как пофиксить такое,скорее всего вообще другой код нужно юзать..
Я делал так

<div class="over-product hidden">
то что у меня скрыто
</div>

и вот сам js

const btn = document.querySelector(".open");
const content = document.querySelector(".over-product");

btn.addEventListener("click", btnClick);

function btnClick() {
  console.log(content.classList);
  content.classList.toggle("hidden");
}

Answer 1

[Pashok Doom]

Что-то в духе такого должно быть

Comments

[VPVPVP]

поставил по вашему примеру,почему то пишет

Uncaught TypeError: Cannot read property 'classList' of null

[Pashok Doom]

VPVPVP, а это уже зависит от вашей разметки. Пример html-а списка товаров скиньте

[VPVPVP]

Pashok Doom,

<div class="col-12 col-lg-6 ">

                  <div class="our-products_item">

                  	     	<div class="over-product hidden">
<b>      тут скрытый контент</b>
                  	     		       	 
       	</div>
                  	 <div class="img-container">
        <img width="1316" height="1277" src="/wp-content/uploads/2020/09/chedder-z-konopleiu.jpg" class="attachment-full size-full wp-post-image" alt="" loading="lazy" srcset="">      </div>

     <div class="txt-container">
        <h3>
          <a href="/product/syr-tverdyj-z-konopleiu/">
            СИР ТВЕРДИЙ “З КОНОПЛЕЮ” ALPINA          </a>
        </h3>
        <div class="txt-descc">
        <p>Опис : Сир твердий козиний 50%</p>
<p>Смак: Ароматний, ситний, з дуже цікавим різнобарвним смаком з легкою кислинкою.</p>
<p>Великий вміст повноцінного білка з насіння конопель, вуглеводів, Омега 3, Омега 6,Омега 9, вітамінів: В1 ,В3, В6, В9, залізо, магній, цинк зробили цей сир надзвичайно корисним.</p>
  </div>
            <div class="sklad">

<div class="wrapper-two">
  <div class="content-two">
    <p>Склад: 2.5% конопляного протеїну та 2.5% конопляного насіння.</p>
  </div>
        </div>
        <p class="price">
	<span class="price"><span class="woocommerce-Price-amount amount"><bdi>57&nbsp;<span class="woocommerce-Price-currencySymbol">грн</span></bdi></span></span>
 / 100 г
        </p>
      	<div class="stock">В наявності</div>
<div class="cart-butt">
         <button class="open"><img class="alignnone size-full" src="/wp-content/themes/maryaniv/app/img/ico-basket.png" alt=""></button>

</div>
             </div>
</div>
    </div>

[VPVPVP]

Pashok Doom, ну это единичный товар,ну т.е там плитка товаров,это один из плитки грубо говоря

[Pashok Doom]

VPVPVP, https://jsfiddle.net/eag0qnbx/ тогда как-то так. Не ручаюсь за адекватность подхода конечно

[VPVPVP]

Pashok Doom, та же ошибка. спасибо за уделённое время.успехов вам.