сделать текст исчезнуть и вернуться обратно при каждом нажатии кнопки

Question

У меня есть элемент кнопки и элемент абзаца. Я прикрепил элемент кнопки к событию eventListener (click), поэтому я хочу, чтобы при нажатии на кнопку текст абзаца исчезал, а когда я нажимал на него снова, тот же щелчок, который я хотел,чтобы вернуться назад, переключаясь назад и вперед, нажмите кнопку исчезнуть, нажмите кнопку исчезнуть.

let button = document.querySelector("button");
button.addEventListener("click",function(e){

let p = document.querySelector("p");
p.style.display = "none";
this.addEventListener("click",function(c){
let p = document.querySelector("p");
p.style.display = "initial";
})
})

Answer 1

Вам нужно добавить только один прослушиватель событий, который включает / выключает класс.

const button = document.querySelector('button');
const p = document.querySelector('p');

button.addEventListener("click", handleClick, false);

function handleClick() {
  p.classList.toggle('hidden');
}

.hidden {
  display: none;
}

<button>Click</button>
<p>Hallo</p>

Answer 2

Используйте оригинальный обработчик событий и измените значение p.style.display в соответствии с текущим значением display:

const button = document.querySelector("button");
const p = document.querySelector("p");

button.addEventListener("click", function(e) {
  p.style.display = p.style.display === "none" ? 'initial' : 'none';

})

<p>Text</p>
<button type="button">Toggle</button>