Is it more efficient to use find() rather than > for child selector in jQuery?

Question

In jQuery, I thought it will be more efficient to find a child DOM with a specific selector with Implementation 1 as below:

var $dataTable =         


        

Answer 1

My guess:

Under the hood $('#XXX whatever') does a native document.queryselectorAll(), which will check all of the elements within the document to see if they match '#xxx whatever'

$('#XXX').find('whatever') first does a document.getElementById('XXX'), finding the element with id="XXX" and then does a queryselectorAll() within that element, so has fewer child elements to test and see if they match 'whatever'

But this guess is completely negated by real data - see the answer by @guest271314