<script type="text/javascript" >
    function goster() {
        document.getElementById("goster").style.display = "none";
        document.getElementById("gizle").style.display = "block";
        document.getElementById("alan").style.display = "block";
    }
  
    function gizle() {
        document.getElementById("gizle").style.display = "none";
        document.getElementById("goster").style.display = "block";
        document.getElementById("alan").style.display = "none";
    }
</script>

#alan{display:none;}
span#goster{cursor:pointer;}
span#gizle{display:none; cursor:pointer;}

<center>
<span id="goster" onclick="goster();" >+</span>
<span id="gizle" onclick="gizle();" >-</span>

<div id="alan" >

Yazılar buraya gelecek

</div>
</center>