Fazer texto de uma div diferente sumir quando outro texto aparecer
<style>
.descricao{
display: none;
}
</style>
<div id="textos1">
<span class="item" onclick="document.getElementById('vaga1').style.display='block'" onmouseout="document.getElementById('vaga1').style.display='none'">Idade</span>
<span class="item" onclick="document.getElementById('vaga2').style.display='block'" onmouseout="document.getElementById('vaga2').style.display='none'">Genero</span>
<span class="item" onclick="document.getElementById('vaga3').style.display='block'" onmouseout="document.getElementById('vaga3').style.display='none'">Estado</span>
</div>
<div id="textos2">
<span class="descricao" id="vaga1">Recomendado a todas as idades</span>
<span class="descricao" id="vaga2">Masculino</span>
<span class="descricao" id="vaga3">Goiás</span>
</div>
Quero colocar um texto dentro da div textos2, mas que não seja fixo, ele tem que sumir quando aparecer os outros textos.
textos meramente ilustrativos