After some research , this answer my question 100%
I am just copy pasting from the above blog
How jQuery Selects Elements Using Sizzle
Selection process
jQuery has a lot of optimization baked in to make things run faster. In this section I will go through some of the queries and will try to trace the route jQuery follows.
$(‘#header’)
When jQuery sees that the input string is just one word and is looking for an id then jQuery invokes document.getElementById . Straight and simple. Sizzle is not invoked.
$(‘#header a’) on a modern browser
If the browser supports querySelectorAll then querySelectorAll will satisfy this request. Sizzle is not invoked.
$(‘.header a[href!=”hello”]’) on a modern browser
In this case jQuery will try to use querySelectorAll but the result would be an exception (atleast on firefox). The browser will throw an exception because the querySelectorAll method does not support certain selection criteria. In this case when browser throws an exception, jQuery will pass on the request to Sizzle. Sizzle not only supports css 3 selector but it goes above and beyond that.
$(‘.header a’) on IE6/7
On IE6/7 querySelectorAll is not available so jQuery will pass on this request to Sizzle. Let’s see a little bit in detail how Sizzle will go about handling this case.
Sizzle gets the selector string ‘.header a’. It splits the string into two parts and stores in variable called parts.
1
parts = ['.header', 'a']
Next step is the one which sets Sizzle apart from other selector engines. Instead of first looking for elements with class header and then going down, Sizzle starts with the outer most selector string. As per this presentation from Paul Irish YUI3 and NWMatcher also go right to left.
