Question

I have multiple buttons toggling the same div (actually iframe on my page). I want them to ‘retoggle’ when I click different buttons, but when I click the samen button again, I just want to close the div.

JSFIDDLE

$(document).ready(function(){
    $('.leftbutton').click(function(){
        if($('#left').is(':visible')) return ; // ignoring
        $('#right').hide();
        $('#left').fadeIn();
    });
});

$(document).ready(function(){
    $('.rightbutton').click(function(){
        if($('#right').is(':visible')){
            $('#right').fadeOut();
            $('#right').fadeIn();
        } 
        else{
            $('#left').hide();
            $('#right').fadeIn();
        }
    });
});

Answer 1

What you can do is store the last button that was clicked as part of the target element. For example:

$(".rightbutton").on('click', function () {
   $("#right").data('lastClicked', this);

Then, compare the last clicked data with this to see whether the button should be shown or not.

http://jsfiddle.net/CfGYG/10/