<div class="popupstick"> <p> Hlasujte v anketě "Čtenáři Receptáře doporučují" a <ins> <a href="http://www.ireceptar.cz/">získejte ZDARMA Edici Receptáře &gt;&gt;</a></ins> <button class="close-stick" title="Close" onclick="document.getElementsByClassName('popupstick').style.display='none';setCookie('hideModal', '2', 7) ;">x</button> </div> <!-- POP UP --> <div id="overlay"> <div class="popupstick2"> <img src="img/anketa-overlay.png" alt="overlay"> <button class="close-popup" title="Close" onclick="document.getElementById('overlay').style.display='none';setCookie('hideModal', '1', 7 ) ;"></button>

Can anybody explain to me guys why in the first button the closing function doesn't work, and in the second one it works? And how is it possible to fix it?

1 answer 1

As already noted in the commentary - please accompany such questions with a minimal, self-sufficient and reproducible example . Without this, the answer search includes the possession of telepathy.

However, it seems to me, I see a problem:

You use document.getElementsByClassName('popupstick').style.display='none' and forget that the getElement s ByClassName function returns an array of elements. The array does not have the [].style . Most likely, clicking on this button spits out an error to the console.

You need to refer to a specific element from the array, which is returned by the document.getElementsByClassName('popupstick') function. If you have one element with such a class, you can simply refer to the zero element ( document.getElementsByClassName('popupstick')[0] ). If there is an unknown number of elements, you will have to loop through the loop and perform an action on each element in turn.

As a result, the code should look like this (if you have one block with the popupstick class):

 document.getElementsByClassName('popupstick')[0].style.display='none';
  • Understood, in the next time I will consider. Thank you very much! - t0rick