html - Javascript hide/show layers -

I am working with JavaScript to hide and show divs, basically I want to show a div, then when Some buttons are hidden that to div and another to show I have not quite understood JavaScript here that what I have at the moment, but the second layer, when I do not click on hide, looks.

  & lt; Script language = javascript type = 'text / javascript' & gt; Function Hadevi () {if (document.getElementById) {// DOM3 = IE5, NS6 document.getElementById ('layer'). Style.visibility = 'hidden'; Document.getElementById ('TopBar'). Style.visibility = 'visisble'; } And {if (document.layers) {// Netscape 4 document .layer.visibility = 'hidden'; Document.topbar.visibility = 'visible'; } Else {// IE 4 document.all.layer.style.visible = 'hidden'; Document.all.topbar.style.visibility = 'visible'; }}} Showdiv () {if (document.getElementById) {// DOM3 = IE5, NS6 document.getElementById ('layer'). Style.visibility = 'visible'; Document.getElementById ('TopBar'). Style.visibility = 'hidden'; } And {if (document.layers) {// Netscape 4 document .layer.visibility = 'visible'; Document.topbar.visibility = 'hidden'; } Else {// IE 4 document.all.layer.style.visibility = 'visible'; Document.all.topbar.style.visibility = 'hidden'; }} & Lt; / Script & gt;   
 and CSS:  
  #topbar {background-image: url (images / back.png); Repeat Background: Repeat; Height: 30px; Margin-top: 20px; Visibility: hidden; } Showing # {Float: Correct; Padding-right: 40px; Padding-top: 10px; } #side {float: true; Padding-right: 40px; } # Layers {background-image: url (image / back page); Repeat Background: Repeat; Padding-left: 20px; Padding-bottom: 20px; Overflow: Auto; }   
 Use standard HTML links like:  
  & lt; A href = "javascript: hidediv ()" & gt; Hide & lt; / A & gt;   
 Any help would be appreciated, cheers!  
 Edit  
 OK, something is completely new but it does not look after hiding  
   
 and  
  & lt; A href = "javascript: zero (0);" Id = "showhide" & gt; Show / Hide & lt; / A & gt;   
 and  
  & lt; Div id = "layer" & gt; & Lt; / Div & gt;    
 
 
 This will probably help you: or  
 Edit:  
 I hope the following examples will help you.  
  & lt ;! DOCTYPE html & gt; & Lt; Html & gt; & Lt; Top & gt; & Lt; Script language = "javascript" type = "text / javascript" src = "jquery.js" & gt; & Lt; / Script & gt; & Lt; Script language = "javascript" type = "text / javascript" & gt; $ (Document) .ready (function () {$ ("# button"). Click (function () {$ ("# a"). Toggle (); $ ("#b") Toggle (); });}); & Lt; / Script & gt; & Lt; / Head & gt; & Lt; Body & gt; & Lt; Div id = "a" & gt; I one & Lt; / Div & gt; & Lt; Div id = "b" style = "display: none" & gt; I am B & Lt; / Div & gt; & Lt; Div id = "button" & gt; & Lt; Button & gt; Show / Hide & lt; / Button & gt; & Lt; / Div & gt; & Lt; / Body & gt; & Lt; / Html & gt;