Using Jquery To Toggle Elements
<p>I am using JQUery 1.7.1 to toggle a div named .interest-group. When you click a link it opens the next div named .interest-group. Right now, you can toggle all of the .interest-group divs to be visible, but I would like to make it that only one can be visible at a time. How can I do this?</p>

<p>JSFIDDLE: <a href="http://jsfiddle.net/DWwKs/6/" rel="nofollow">http://jsfiddle.net/DWwKs/6/</a></p>

<p>Here is my JQuery:</p>

<pre><code>$(document).ready(function () {
    $('.interest').toggle(

    function () {
        $(this).next('.interest-group').show();
    },

    function () {
        $(this).next('.interest-group').hide();
    });
});
</code></pre>
