Show / Hide DIV, Javascript

by Ray

HTML

<div id="idTab5" style="height:200px">Filters Displayed here</div>
<input id="showlessbutton" type="button" style="" value="Hide Filters & Search -" onclick="showwLess()"> 
<input id="showmorebutton" type="button" style="display: none" value="Show Filters & Search +" onclick="showwMore()">

CSS

#idTab5 {
  font-size: 12px;
  line-height: 14px;
}
#showlessbutton {
  height: 25px;
  padding: 1px 6px;
  margin-top: 5px;
}
#showmorebutton {
  height: 0px;
  padding: 1px 6px;
  margin-top: 5px;
}

JavaScript

var button = document.getElementById("showmorebutton");
var idTab5 = document.getElementById("idTab5");
var button2 = document.getElementById("showlessbutton");

function showwLess() {
	idTab5.style="display:none;height:0px";
	showlessbutton.style.display="none";
	showmorebutton.style="height:25px";
	showmorebutton.style.display="block";

}

function showwMore() {
	idTab5.style="height:200px";
	showmorebutton.style.display="none";
	showlessbutton.style="height:25px";
	showlessbutton.style.display="block";
}