Function runs only on double-click

Hi! I have one function with if else statement, but the function runs only on double-click, even though I have onclick not dblclick … (boxB only get visible after double click…)

<div class="boxA" style="visibility: visible;"></div>
<div class="boxB" style="visibility: hidden;"></div>
<button class="showboxB"></button>

const showboxB = document.querySelector('.showboxB');
const boxA = document.querySelector('.boxA');
const boxB = document.querySelector('.boxB');

.showboxB.onclick = () => {
   if ( == 'hidden') { == 'visible'; == 'hidden';


I’ve edited your post for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.

See this post to find the backtick on your keyboard. The “preformatted text” tool in the editor (</>) will also add backticks around text.

Note: Backticks are not single quotes.