Selecting JUST visible elements (without getting the elements that are inside INvisible elements)

Selecting JUST visible elements (without getting the elements that are inside INvisible elements)


The concept is simple: to find the elements that are visible at the
screen.
But by using the :visible selector, it verify only the element itself,
so if a parent element is hidden, the child is still considered as
visible.
Here's an example markup:
<div style="display:none;"><span>TEST</span></div>
If we use this selector:
$("div:visible");
It will find nothing because the div is not being shown.
But, if we use this:
$("div span:visible");
It finds the span even when the tag tag is inside a hidden block.
I don't know if it's a bug or a expected result, but I needed to use
this concept to find visible input fields in my webapp (that has a lot
of forms that are hidden along the requests, like a wizard), and this
simple selector was'nt working. So, here's a workaround that can be
used to find an visible element at the document independently of its
parents.
$("div span[offsetWidth>0]");
As we know, the offsetWidth is a readonly property of a element that
returns its position on screen, and if it's not visible, the value is
zero (and the same occurs with offsetHeight).
Honestly, I did'nt tested it widely in various situations, but in my
case resolves the problem.
Therefore, if the :visible selector result is not the expected, I let
this as a suggestion to implement at jQuery's next releases.
And please, correct me if I'm wrong in some point.
Cheers!