JSFiddle - React, Tailwind, and code Playground

HTML

<div id="foo">
    <div id="bar"></div>
    <div id="baz"></div>
</div>

<textarea id="result"></textarea>

CSS

textarea {
    width: 400px;
    height: 200px;
}

JavaScript

var foo = $('#foo');
var bar = foo.find('#bar');
var baz = foo.find(document.getElementById('baz'));

var result = '';
result += '{expression}:  actual, expected\n';
result += '-------------------------------\n';
result += 'foo:           ' + foo.length + ', 1\n';
result += 'bar:           ' + foo.length + ', 1\n';
result += 'baz:           ' + foo.length + ', 1\n';
result += 'foo.andSelf(): ' + foo.andSelf().length + ', 1\n';
result += 'bar.andSelf(): ' + bar.andSelf().length + ', 2\n';
result += 'baz.andSelf(): ' + baz.andSelf().length + ', 2\n'; // assertion failed...
$('#result').append(result);