getByClassName

Benchmark created on

Description

Change an attribut of

jquery selector for a classname

vs.

document.getElementByClassName in a for-in Loop

Preparation HTML

<div id="header">
<div class="content">Hey, here is content !</div>
</div>

<div class="content">Hey, here is content !</div>

<div id="footer">
<div class="content">Hey, here is content !</div>
</div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

Test runner

Ready to run.

Testing in
TestOps/sec
jQuery
$('.content').css('color', 'red');
ready
pure JS
var content = document.getElementsByClassName('content');
for (var i = 0; i < content.length; i++) {
  content[i].style.color = 'red';
}
ready

Revisions

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