jQuery .each() vs for loop

Benchmark created on

Preparation HTML

<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<div class="myClass" id="foo1"></div>
<div class="myClass" id="foo2"></div>
<div class="myClass" id="foo3"></div>
<div class="myClass" id="foo4"></div>
<div class="myClass" id="foo5"></div>
<div class="myClass" id="foo6"></div>
<div class="myClass" id="foo7"></div>
<div class="myClass" id="foo8"></div>
<div class="myClass" id="foo9"></div>
<div class="myClass" id="foo10"></div>

Test runner

Ready to run.

Testing in
TestOps/sec
jQuery each()
var aryIDs = [];

$(".myClass").each(function(){
    //Add ID to the array while stripping off all non-numeric data using RegEx
    aryIDs.push($(this).attr('id').replace(/[A-Za-z$-]/g, ""));
});
ready
for loop
var aryIDs = [];
var divs = $(".myClass");

for(var i= 0; i < divs.length; i++)
{
    aryIDs.push(divs[i].id.replace(/[A-Za-z$-]/g, ""));
}
ready
jQuery map()
var form_ids = $('.myClass').map(function(){return this.id.replace(/[a-z_]/gi,'');}).get().join(', ');
ready

Revisions

You can edit these tests or add more tests to this page by appending /edit to the URL.