Show/Hide Multiple Divs

[ifm1989]

I want the user to be able to click a link and divs at multiple locations around the page will show/hide.

 

This is my current code

 

echo '<script type="text/javascript">
<!--
    function toggle_visibility(id) {
       var e = document.getElementById(id);
       if(e.style.display == \'block\')
          e.style.display = \'none\';
       else
          e.style.display = \'block\';
    }
//-->
</script>';

 

echo "<div id='foo'>sample</div> blah blah <div id='foo'>sample</div>";

 

echo "<a onclick=\"toggle_visibility('foo');\">Display Details</a>";

 

The page is PHP (which I know much, much better than Javascript, haha).

 

Any ideas what's up? Is there a way to do this? What am I doing wrong?

[ifm1989]

I've been thinking. This must be caused by multiple divs with the same id.

 

I would be able to generate new names for the divs (foo1, foo2, etc.). So then how would I go about calling my generated list of foo1, foo1, etc?