jquery - How to check if a div is visible state or not?

Question

I have tabs like this.

<li id="singlechatpanel-1" style="visibility: hidden;">
     //content
</li>

Trying to check it like this:

$(".subpanel a").click(function() 
     {
        var chatterNickname = $(this).text();

        if(!$("#singlechatpanel-1").is(':visible'))
        {
            alert("Room 1 is filled.");
            $("#singlechatpanel-1").css({'visibility':'visible'});
            $("#singlechatpanel-1 #chatter_nickname").html("Chatting with: " + chatterNickname);
        }

If condition always returns false. How can I check visibility state of this div?

question from:https://stackoverflow.com/questions/12353741/how-to-check-if-a-div-is-visible-state-or-not

Answer 1

Check if it's visible.

$("#singlechatpanel-1").is(':visible');

Check if it's hidden.

$("#singlechatpanel-1").is(':hidden');