Toggling divs in javascript
<p>I want to toggle divs by clicking on links. but things are not going well for me when I click on a link it shows a new div but don hide the previous one</p>

<p>JavaScript Code</p>

<pre><code>&lt;script type="text/javascript"&gt;
    function toggle(id){ 
        var el = document.getElementById(id);
        if(el != null &amp;&amp; el.style["display"]== 'none'){ 
            el.style["display"] = "block";
        }
    }
&lt;/script&gt;
</code></pre>

<p>My divs code</p>

<pre><code>&lt;?php foreach($titles_data as $title){ ?&gt;
 &lt;div style="display:none" id="content_&lt;?php echo $title['idtitles'] ?&gt;"&gt;
   &lt;div id="left-ad"&gt;&lt;/div&gt;
 &lt;/div&gt;
&lt;?php } ?&gt;  
</code></pre>

<p>My links code</p>

<pre><code>&lt;?php foreach($titles_data as $title){ ?&gt;
&lt;li class="flag_&lt;?php echo strtoupper($title['language']) ?&gt;"&gt;
 &lt;a id="title_&lt;?php echo $title['idtitles'] ?&gt;" href="" title="&lt;?php echo $title['title'] ?&gt;" onclick="toggle('content_&lt;?php echo $title['idtitles'] ?&gt;')"&gt;
 &lt;/a&gt;
&lt;/li&gt;
&lt;?php } ?&gt;
</code></pre>

<p>How can it be done so that when i click on link its respective iv becomes visible and the previous one hides?</p>

<p>Thanks</p>
