Как сделать клик по элементу?

Question

[Sedbol]

На странице есть элементы с одинаковым ID после клика по этому элементу у него становится свойство CSS display:none. А в обычном состояние то есть до клика display: block; как кликнуть по всем элементам у которых свойство display: block;?

<div id="bon" class="btn-send-gift-for-beginner" style="display: block;"> 
<div id="bon" class="btn-send-gift-for-beginner" style="display: block;"> 
<div id="bon" class="btn-send-gift-for-beginner" style="display: block;"> 
<div id="bon" class="btn-send-gift-for-beginner" style="display: none;"> 
<div id="bon" class="btn-send-gift-for-beginner" style="display: block;">

Answer 1

[Александр Вульф]

1. Одинаковых ID на странице быть не должно. Это ошибка.
2.

Array.from(document.querySelectorAll('[style*="display: block"]')).forEach(el => el.click())

Comments

[Sedbol]

Однако так бывает когда элементы создаются в цикле!

[Александр Вульф]

Sedbol, делайте не ID, а класс. Либо делайте ID вида bon-1, bon-2, bon-3, etc.

Answer 2

[Ruslan Ruslanov]

вероятно как то так...

document.querySelectorAll('#bon').forEach(function (element) {
        if (element.style.display = "block")
            element.click();
    });

Answer 3

[coderisimo]

ID должен быть уникальным! Селекть по классу.

for (let item of document.getElementsByClassName('btn-send-gift-for-beginner')) {  
    if(item.style.display !=='none')
    item.click();
  }