Q:

Making onclick event toggle display on subsequent clicks?

I have a div followed by a fieldset. I have it such you click the div anywhere and it makes the otherwise display:none fieldset appear. However, I'd like it to disappear on second click, as well. Basically the onclick event would toggle between display:none and display:block.
Here's the fiddle I'm working with: http://jsfiddle.net/zk1j23m5/

function showexpando(id) {
  document.getElementById(id).style.display = "block";
}
.greyex {
  padding: 15px;
  padding-left: 30px;
  padding-right: 30px;
  border: solid black 3px;
  border-top: 0px;
  border-radius: 0px 0px 7px 7px;
  background-color: #DDDDDD;
  display: none;
}
.expando {
  background-color: #A971A9;
  font-weight: bold;
  padding: 5px;
  text-align: center;
  border: 3px solid black;
  border-radius: 7px 7px 0px 0px;
  border-bottom: 0px;
  cursor: pointer;
}
.expando a {
  text-decoration: none;
}
<div class="expando" onclick="showexpando('excred');">
    <a>&#x25BC; lorem &#x25BC;</a>
</div>
<fieldset class="greyex" id="excred">ipsum</fieldset>

Additionally, there's some problem with the border. I'd like the expando div to have border-radius: 7px when the fieldset is hidden, but have border-radius:7px 7px 0px 0px; border-bottom: 0px when the fieldset is visible. Lastly, the border doesn't look right when fieldset is visible: there's like a 1px difference in positioning despite the code being congruent.
How can I accomplish these?
edit; I guess I could query the document if fieldset is display:none and fiddle with the CSS accordingly using JS, but it seems unwieldy and I'm sure there's an easier solution.

A:

You should use unobtrusive JavaScript instead.
I'd suggest toggling a class. For instance:
Updated Example
var expand = document.querySelector('.expando');

expand.addEventListener('click', function () {
    this.nextElementSibling.classList.toggle('visible');
});

.greyex {
    display: none;
}
.greyex.visible {
    display: block;
}

References:

.nextElementSibling (IE9+)
.classList (IE10+)

