title: Javascript code to get back to the same page when click the cancel button
body: <p>I am using javascript code to expand and collapse my div contents.The follwing are my code.</p>
  
  <pre><code>    &lt;style type="text/css"&gt;
      .gap
      {
  
       border:1px solid black
  
      }
      &lt;/style&gt;
  
      &lt;script type="text/javascript"&gt;
  
          function toggle_visibility(id) {
             var e = document.getElementById(id);
  
             if(e.style.display == 'none')
                e.style.display = 'block';
  
             else
                e.style.display = 'none';
  
          }
  
          function edit(id,item)
          {
             var e = document.getElementById(id);
             var f = document.getElementById(item)
  
            e.innerHTML=f.innerHTML;
  
          }
  
      &lt;/script&gt;
  
      &lt;a href="#" onclick="toggle_visibility('id1');" &gt;&lt;div class="gap"&gt;Click here to toggle visibility of element #foo&lt;/div&gt;&lt;/a&gt;
  &lt;div id="id1" style="display:none;"&gt;This is foo&lt;/div&gt;
  
   &lt;a href="#" onclick="toggle_visibility('id2');" &gt;&lt;div class="gap"&gt;Click here to see      wonder&lt;/div&gt;&lt;/a&gt;
  &lt;div id="id2" style="display:none;"&gt;Tsdgdfsehd
  &lt;div&gt; &lt;a href="#"  onclick="edit('id2','id3');"&gt;Edit&lt;/a&gt;&lt;/div&gt;
  &lt;/div&gt;
  
      &lt;div id="id3" style="display:none;"&gt;Edit
      &lt;div&gt; &lt;a href="#"  onclick="edit('id3','id2');"&gt;cancel&lt;/a&gt;&lt;/div&gt;
  
      &lt;/div&gt;
  </code></pre>
  
  <p>The problem I am facing is..when I click the second div,It is expanding and I have given a edit option inside the 2nd div..and click the edit it is overriding the second div elements and displaying the 3rd div element.
  The same way,In the 3rd div I have given the link for cancel the edit section and to display the 2nd div contents..but it is not displaying..</p>
  
  <p>I am waiting for help..</p>
  
  <p>Thanks In advance</p>