jQuery function not working

Question

$("#trigger-1").click(function () {
    $("#secondary").animate({ width: 0 });
    $("#primary").animate({ width: '100%' });
    $("#panel-1").css({ display: "block" }).animate({
        height: 200,
        width: '100%',
        opacity: 1
    });
    return false;
});
$("#trigger-2").click(function () {
    $("#secondary").animate({ width: 0 });
    $("#primary").animate({ width: '100%' });
    $("#panel-2").css({ display: "block" }).animate({
        height: 200,
        width: '100%',
        opacity: 1
    });
    return false;
});
$("#return").click(function () {
    alert(1);
    $("#primary").animate({ width: '60%' });
    $("#secondary").animate({ width: '40%' });
    $(".panel").animate({
        height: 0,
        width: 0,
        opacity: 0
    });
    return false;
});

Return is not working for panel-2. Please check this fiddle: http://jsfiddle.net/HTVXv/ Also, please guide me if its possible to refactor and reduce the code.

Thanks!

Harmen · Accepted Answer · 2010-11-03 15:44:05Z

6

No wonder, id's should be unique, so you cannot use them twice.

A solution is to use a class, like class="return" and $(".return").click()

edited Nov 3, 2010 at 15:44

answered Nov 3, 2010 at 15:38

Harmen

22.5k4 gold badges57 silver badges77 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

lonesomeday Over a year ago

+1 I just forked the fiddle to show exactly this. jsfiddle.net/lonesomeday/6HgX8

Jacob Mattison · Accepted Answer · 2010-11-03 15:40:50Z

1

The "id" attribute must be unique on the page; you're trying to give both "Return" links the id of "return", so only the first one has that id. Try using a class instead.

answered Nov 3, 2010 at 15:40

Jacob Mattison

51.2k11 gold badges109 silver badges128 bronze badges

Comments

xandy · Accepted Answer · 2010-11-03 15:41:43Z

1

It's not working because you have two "a"s with same id. Try renaming one of those and bind it to click and it will work.

answered Nov 3, 2010 at 15:41

xandy

27.4k8 gold badges61 silver badges66 bronze badges

Collectives™ on Stack Overflow

jQuery function not working

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related