Getting divs to close if another one opens with Javascript

Question

Basically I have signup and signin and I they're both divs which appear and disappear on the click of a link but I wish for one to close if the other is clicked and then opened.

Example: signin area is open and signup button is clicked. I wish for signin area to disappear and for the signup content to be revealed.

Current Code:

<script language="javascript"> 
function toggle() {
    var ele = document.getElementById("signin");
    var text = document.getElementById("signtext");
    var ele2 = document.getElementById("signup");
    var text2 = document.getElementById("signuptext");
    if(ele.style.display == "block") {
        ele.style.display = "none";
        text.innerHTML = "show";
        ele2.style.display = "block";
        text2.innerHTML = "hide";
    }
    else {
        ele.style.display = "block";
        text.innerHTML = "hide";
        ele2.style.display = "block";
        text2.innerHTML = "hide";
    }
}
function toggle2() {
    var ele2 = document.getElementById("signup");
    var text2 = document.getElementById("signuptext");
    var ele = document.getElementById("signin");
    var text = document.getElementById("signtext");
    if(ele2.style.display == "block") {
        ele2.style.display = "none";
        text2.innerHTML = "show";   
        ele.style.display = "block";
        text.innerHTML = "hide";
    }
    else {
        ele2.style.display = "block";
        text2.innerHTML = "hide";
        ele.style.display = "block";
        text.innerHTML = "hide";
    }   
} 
</script>

Html :

<div id="signin" style="display: none">
<form action="loginscript.php" method="post">
<p>Username:<input type="text" id="username"></p>
<p>Password:<input type="password" id="password"> <input type="submit" value="submit"></p>
</form>
</div>
<div id="signup" style="display: none">
<h1>peek-a-boo</h1>
</div>

Answer 1

Try this.There is no need of creating two different functions.Lesser the number of functions=Better the code + smarter is the coder!!!!

function toggle(id){

switch(id)
{
case 'signin':
document.getElementById('signin').style.display='block';
document.getElementById('signup').style.display='none';
break;

case 'signup':
document.getElementById('signup').style.display='block';
document.getElementById('signin').style.display='none';
break;
}

HTML

<div id="signin" onclick="toggle(this.id)"> SignIN</div>
<div id="signup" onclick="toggle(this.id)"> SignUp</div>