tabs in javascript resetting
<p>Sorry this is probably stupid wood for trees stuff but:</p>

<p>All I want is a <code>div</code> with a couple of links - you click on the links and you switch to another <code>div</code>. Standard tab stuff.  That's it. But when I run the code below, it switches to the <code>div</code> I want then resets straight back to the original div.  Why?</p>

<p>the Javascript:</p>

<pre><code>number_of_pages = 4;  
function cyber(page)
{  
    for(i = 1; i &lt;= number_of_pages; i++)  
    {  
        off = 'monitor' + i;  
        document.getElementById(off).style.display = 'none';  
    }  
    on = 'monitor' + page;  
    document.getElementById(on).style.display = 'block';  

    alert(on); //debug  
}
</code></pre>

<p>the CSS:</p>

<pre><code>.monitor{width: 400px; border: 1px solid #333; padding: 10px 10px 10px 10px}
</code></pre>

<p>the HTML:</p>

<pre><code>&lt;div class="monitor" id="monitor1" style="display: block"&gt;  
&lt;a href="" onclick="cyber(2)"&gt;foo&lt;/a&gt;&lt;br /&gt;  
&lt;a href="" onclick="cyber(3)"&gt;bah&lt;/a&gt;&lt;br /&gt;  
&lt;/div&gt;  

&lt;div class="monitor" id="monitor2" style="display: none"&gt;
&lt;a href="" onclick="cyber(1)"&gt;homepage&lt;/a&gt;
&lt;/div&gt;
</code></pre>

<p>etc...</p>

<p>Many thanks in advance.</p>
