title: Show or Hide div from label Click
body: <p>I have three labels having folowing code on all with different ids and three divs with different ids</p>
  
  <pre><code>&lt;asp:Label ID="CA" runat="server"  Font-Bold="False" Font-Names="Arial" Font-Size="10pt" style="padding-top:6px;" ForeColor="#CCCCCC" Height="100%" Text="Current Activities" onmouseover="var b = ChangeColorCA(); this.style.cursor='pointer'; return b" onmouseout="RemoveColorCA()"&gt;&lt;/asp:Label&gt;&amp;nbsp;
  </code></pre>
  
  <p>here is div code for all</p>
  
  <pre><code>&lt;div id="DIV_CA" runat=server align="center" visible="false" style="background-color:#f3f3f3; text-align: left; width: 500px; height: 470px; overflow:auto;"&gt;Some data&lt;/div&gt;
  </code></pre>
  
  <p>I want to make a show or hide mechanism from label click can anyone tell me how can i do this that when i click a label then the a specific div should show and others should hide and when i click next label the its coresspondent div should show.</p>
  
  <p><strong>UPdate</strong>
  This is My Script Code</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
    function hideshow(span) {
      var div = document.getElementById("DIV_" + span.id);
      if (div.style.display == "none")
         div.style.display = "block";
      else
         div.style.display = "none";
      }
  &lt;/script&gt; 
  </code></pre>
  
  <p>and here is lablel code</p>
  
  <pre><code>&lt;asp:Label ID="CA" runat="server"  Font-Bold="False" Font-Names="Arial" Font-Size="10pt" style="padding-top:6px;" ForeColor="#CCCCCC" Height="100%" Text="Current Activities" onmouseover="var b = ChangeColorCA(); this.style.cursor='pointer'; return b" onmouseout="RemoveColorCA()" onclick="hideshow(this)"  &gt;&lt;/asp:Label&gt;&amp;nbsp;
  </code></pre>