Javascript: ocultando e mostrando a tag div com um botão de alternância

Eu vou direto ao assunto:

O que eu preciso fazer é ocultar uma div em particular com o pressionar de um botão, e é suposto ser uma alternância, então basicamente: Pressione uma vez para ocultar, pressione novamente para mostrar, pressione novamente para ocultar etc ...

Eu quero que as regras de ocultar / mostrar sejam feitas em CSS e a interação em javascript puro (sem jquery, por favor). Bem, é isso que preciso fazer, mas não tenho certeza de como executar o código javascript.

html:

<p class="button">Show/hide<p>

<div> I want to hide this by pressing the button above</div>

css:

#showhide {
     display: none;
}

.button {
    display: block;
    height: 30px;
    width: 100px;
    background: green;
    text-align: center;
    padding-top: 10px;
    padding-left: 0px;
    font: 15px arial bold;
    border: 1px solid black;
    text-decoration: none;
    list-style:none;
    margin: 10px 0px 10px 0px;
}

http://jsfiddle.net/fyUJc/14/

Além disso, se você acha que essa pergunta não pertence aqui ou é estúpida, tente não ser rude, só estou tentando aprender aqui.

questionAnswers(4)

yourAnswerToTheQuestion