Child selector bug? More TDs

HTML

<table id="rec" border="1" cellpadding="4">
	<tr>
        <td>This TD SHOULD be colored<br /><input type="text" /></td>
        <td>this one should NOT</td>
		<td id="wrong">neither should this one
			<table border="1" cellpadding="4">
				<tr>
                    <td>but this one SHOULD<br /><input type="text" /></td>
                </tr>
			</table>
		</td>
	</tr>
</table>
<input type="button" id="colorB" value="Bad — .has() method" /><br />
<input type="button" id="colorG" value="Good — :has() selector" /><br />
<input type="button" id="colorY" value="Good — Find inputs then tds" /><br />

JavaScript

$(document).ready(function () {
    $('#colorB').click(function () {
        $('td').css('background-color', '');
        $('#rec td').has('>input').css('background-color', 'red');
    });
    $('#colorG').click(function () {
        $('td').css('background-color', '');
        $('#rec td:has(>input)').css('background-color', 'green');
    });
    $('#colorY').click(function () {
        $('td').css('background-color', '');
        $('#rec input').closest('td').css('background-color', 'yellow');
    });
});