Show/Hide cu javascript

Buna ziua!

Am 10 intrebari iar sub fiecare intrebare este un buton.
Cand este apasat butonul de sub intrebarea 1 sa se afiseze doar raspunsul 1. Raspunsurile sunt div-uri separate.
Daca se mai apasa inca o data acest buton sa se ascunda raspunsul.
Cand este apasat butonul de sub intrebarea 2 sa se afiseze raspunsul 2 dar sa nu se ascunda raspunsul la intrebarea 1.

Pe "w3schools.com" este o varianta pentru o singura intrebare/raspuns. https://www.w3school...oggle_hide_show
Pe "stackoverflow.com" nu imi place pentru ca la inceput apare afisat raspunsul 1 din start si cand se apasa un buton se ascund raspunsurile afisate precedent: https://stackoverflo...divs-javascript

Va rog sa completati aici:   http://jsfiddle.net/78nxrqkp/1/
Multumesc!

Edited by alex05ok, 16 March 2019 - 09:29.

http://jsfiddle.net/kohyuep2/

Eu vreau ca in exemplul acesta cu 3 intrebari. Cum fac sa unesc cele 3 functii pentru ca nu vreau fiecare buton cu functia sa.
https://codepen.io/d...are1/pen/wOjMNR

function myFunction1() {
  var x = document.getElementById("myDIV1");
  if (x.style.display === "none") {
	x.style.display = "block";
  } else {
	x.style.display = "none";
  }
}
function myFunction2() {
  var x = document.getElementById("myDIV2");
  if (x.style.display === "none") {
	x.style.display = "block";
  } else {
	x.style.display = "none";
  }
}
function myFunction3() {
  var x = document.getElementById("myDIV3");
  if (x.style.display === "none") {
	x.style.display = "block";
  } else {
	x.style.display = "none";
  }
}

HTML

<p>Intrebarea 1</p>
<button onclick="myFunction1()">Afiseaza/Ascunde</button><br>
<div id="myDIV1"><p>Raspuns 1.</p></div>
<p>Intrebarea 2</p>
<button onclick="myFunction2()">Afiseaza/Ascunde</button><br>
<div id="myDIV2"><p>Raspuns 2.</p></div>
<p>Intrebarea 3</p>
<button onclick="myFunction3()">Afiseaza/Ascunde</button><br>
<div id="myDIV3"><p>Raspuns 3.</p></div>

Transmitand id-ul ca parametru?