Как отобразить скрытый элемент тега html <p> с помощью JavaScript?

Вы можете использовать атрибут removeAttribute

document.getElementById("button").removeAttribute('hidden')

<p hidden id="button">
  <a id="dashboard-btn" 
     href="www.google.com" 
     target="_blank" 
     rel="noopener noreferrer">
      www.google.com
    </a>
</p>

Вы скрываете свой элемент с помощью атрибута hidden поэтому вам нужно управлять этим атрибутом, а не таким стилем, как:

document.getElementById("button").hidden = false; 

<p hidden id="button">
    <a id="dashboard-btn" href="www.google.com" target="_blank" rel="noopener noreferrer">
      www.google.com
    </a>
</p>

Ссылка:

• скрытый

Попробуйте с этим

document.getElementById("button").removeAttribute("hidden")

Вы можете удалить атрибут "скрытый".

document.getElementById("button").removeAttribute("hidden")

У меня есть несколько решений:

A

document.getElementById("button").hidden = "false";

Как скрыто-это не свойство видимости css : скрыто;.

Это атрибут.

B

Как упоминал @tacoshi,

.hidden {
  opacity: 0;
  transition: opaicty 1s ease;
  /* use opacity in case you want to have a beautiful transition */
}

И просто используйте

document.getElementById("button").classList.toggle("hidden")