JQuery Check to See if Div is Shown

Question

This is what I am ultimately trying to achieve:

//When the user clicks the liveshow button this happens
    $(".liveshow-button").live('click', function() {
        if ($(".liveshowDiv2").css('display') == 'none') {
            $(".liveshowDiv2").fadeOut(ifadeOutSpeed, function() {
                $('#wrapper-div').animate({ height: $('.liveshowDiv1').height() + "px" }, iresizeSpeed, function() {
                    $('.liveshowDiv1').fadeIn(ifadeInSpeed, function() {
                    });
                });
            });
        }
        else {
            alert('This never gets displayed');
            $(".liveshowDiv1").slideUp('fast');
        }
    });

Basically I want to toggle between liveShowDiv1 being displayed and hidden when you click this button. But since other things on the page can make liveShowDiv1 hidden, I can't just make a toggle function to do this. I have to check somehow to see if liveShowDiv1 is being displayed or not.

When it not displayed: display = none

When it is showing display is not in the style tag at all

How can I tell in JQuery when this div is displayed?

Answer 1

if ( $(this).is(':visible') ) should work for this relatively simple show/hide.