Check whether .toggle() or .hide() has hidden an element
I'm working on some code that shows and hides elements in response to filtering options and I'm trying to determine whether an element's visibility needs to be toggled or not. I know whether the element should be visible or hidden. If it should be visible, I want to first check if it is already visible. If it's not, then add it to an array of elements to call toggle on later.
I tried using .is(":visible"). The problem is, this tells me whether the element is actually visible, not whether it was specifically hidden by an earlier toggle call. E.G. if the element was not explicitly hidden, but one of it's parents was, .is(":visible") is false. What I actually would need to know, in this case, is whether my element has the display:none style on it because that is what toggle sets on it.
Checking display:none would be easy enough, but that would defeat the purpose of using the .toggle function in the first place, which is to abstract the means of showing/hiding an element. .toggle() , .hide() and .show() simply let me tell jQuery to show or hide an element, so I don't have to care or know how it does it. If I were to check for display:none directly, there could potentially be a type of element or some other browser in which jQuery hides the element using something other than display:none and then my code wouldn't work. So is there a way to check whether an element, itself, has been hidden by jQuery?