Jquery -> normal js conversion

Here is a piece of javascript code with jquery:

$('li.pages span a').click(function() { whatever(); });

I need to write same code, but without using jquery. It must be as small as possible and be compatible with modern mobile browsers. What’s the most efficient way to replace $(‘li.pages span a’)?

This should work for you:


// jQuery
$('li.pages span a').click(function() { 
	whatever(); 
});

// Plain Javascript
var list = document.querySelectorAll('li.pages span a'),
	i = 0;
for( i; i < list.length; i++ ) {
	list[i].addEventListener('click', function() {
		whatever2();
	}, false)
}

The only thing to watch out for is browser support: “querySelectorAll” isn’t supported in IE6/7, and “addEventListener” isn’t supported in IE6/7/8