How to show the DIV related with clicked link and hide other DIVs with Jquery?

Question

Hello,

As I summarized at topic I want to show the DIV related with clicked link and hide other DIVs with Jquery. To be able to understand what I am saying, please visit Worldlines

You will see there the topics related with some news. When somebody clicked on a topic the news div will slide-down below clicked topic and previously read news div will hide.

I think I told what I want clearly.

Thank you,

Answer 1

You'll add a script at the beginning of your html like so:

<script type="text/javascript" src="/jquery-1.4.1.min.js"></script> 
<script type="text/javascript">

    function showPanel2() {
    $('#Panel1').hide();
    $('#Panel2').show();
    }

</script>

This will hide one panel and show another. The "Panel1" and "Panel2" are simply the IDs of the panels you'll be showing or hiding. And then you'll have the following code on your button:

 <input type="button" onclick="showPanel2();" value="Submit" />

This should be simple enough to modify if you want to hide multiple panels.

Answer 2

Jquery Accordion was what I look for. You can find it here http://jqueryui.com/demos/accordion/