JSFiddle - React, Tailwind, and code Playground

HTML

<div class="contacts">
        <h1>All contacts</h1>
        <div class="contact new">
            <p class="name">Jim Jones</p>
            <p class="phone">(555) 555-1212</p>
        </div>
        <div class="contact new">
            <p class="name">Bob Smith</p>
            <p class="phone">(555) 555-1213</p>
        </div>
        <div class="contact new">
            <p class="name">Dave Baker</p>
            <p class="phone">(555) 555-1214</p>
        </div>
        <div class="contact">
            <p class="name">Pete Harrison</p>
            <p class="phone">(555) 555-1215</p>
        </div>
        <div class="contact">
            <p class="name">George Donald</p>
            <p class="phone">(555) 555-1216</p>
        </div>
        <div class="contact">
            <p class="name">Chris Root</p>
            <p class="phone">(555) 555-1217</p>
        </div>
    </div>

<div id="cssScoped">
    <h1>New Contacts (CSS selector scoped)</h1>
</div>
<div id="jqScoped">
    <h1>New Contacts (jQuery selector scoped)</h1>
</div>

CSS

.contacts, #cssScoped, #jqScoped { margin: 20px; }
h1 { text-decoration: underline; }

JavaScript

var first_before = new Date();
for(var i=0;i<100000;i++)
    $('.contacts .new')
var first_after = new Date();

var second_before = new Date();
for(var i=0;i<100000;i++)
    $('.new', '.contacts')
var second_after= new Date();

console.log(first_after-first_before);
console.log(second_after-second_before);