jQuery bug with child selector and visible

Demo for http://bugs.jquery.com/ticket/11079

by Timmy Willison

HTML

<div id="outer">
    <div>
        <div><span>div-wrapped</span></div>
    </div>
    <div>
        <p><span>p-wrapped</span></p>
    </div>
</div>
<br/>
<table id="output">
    <tr><th>Selector</th><th>Matches</th></tr>
</table>

CSS

th, td { padding:4px; border:1px solid black; }

JavaScript

var selectors = [
    "#outer > div span",
    "#outer div:visible span",
    "#outer > div:visible span"
];

var selector, matches, row, cells,
    output = $("#output");
for (var i = 0; i < selectors.length; ++i) {
    selector = selectors[i];
    matches = $(selector);
    row = $("<tr><td></td><td></td></tr>");
    cells = $("td", row);

    cells.eq(0).text(selector).end()
        .eq(1).text(matches.map(function() { return $(this).text(); }).get().join(", "));
    output.append(row);
}