Butona Basınca display:none

Merhabalar,
Benim Bir butonum var ona basınca id="text" verdiğim bütün yazıları display:none yapmak istiyorum.internette bir kod buldum fakat verdiğim bütün yazıları değilde ilk yazıyı siliyor

<i class="ri-menu-fill" onclick="closeNavs()"></i>
<script>
function openNavs() {
  document.getElementById("text").style.display = "block";
}

function closeNavs() {
  document.getElementById("text").style.display = "none";
}
</script>

<div id="text">Yazi1</div>
<div id="text">Yazi2</div>

Mesela Bu Örnekte Yazi2 Yi Siliyor sadece Butona Basınca ama ben bütün id="text" değeri alanları silmek istiyorum yardım ederseniz sevinirim.

İd ile değil class ile yaparsanız çözülecektir

id Değeri bir etikete özel mahsustur.
HTML tarafında div içerisindeki id attribute'ü yerine class kullanmanız belki sorunu giderebilir.

Teşekkür ederim cevaplarınız için bu kullandığım koddaki id yerine classı nasıl gösterebilirim
document.getElementById("text").style.display = "none";

var elms = document.querySelectorAll("#text");
for(var i = 0; i < elms.length; i++)
elms[i].style.display='none';

document.getElementsByClassName("text" )

Cevaplarınız İçin Teşekkür ederim class olarak atadım fakat olmadı
var elms = document.querySelectorAll("[id='text']");
for(var i = 0; i < elms.length; i++)
elms[i].style.display='none';
bu kod ile çözüldü tekrardan teşekkür ederim.