CODEWITHSUNDEEP
jquery
user2096890
user2096890

Reputation: 159

Using Jquery To Toggle Elements

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?

JSFIDDLE: http://jsfiddle.net/DWwKs/6/

Here is my JQuery:

$(document).ready(function () {
    $('.interest').toggle(

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

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

Upvotes: 1

Views: 345

Answers (2)

adeneo
adeneo

Reputation: 318352

That version of toggle() was deprecated in jQuery 1.7, and removed in 1.9, try this instead :

$(document).ready(function () {
    $('.interest').on('click', function(e) {
        e.preventDefault();
        $('.interest-group').hide();
        $(this).next('.interest-group').toggle();
    });
});

FIDDLE

Upvotes: 2

Serj Sagan
Serj Sagan

Reputation: 30267

Here you go: http://jsfiddle.net/DWwKs/8/

Just add the $('.interest-group').hide(); to the first function

Upvotes: 0

Related Questions