Question

What would be the correct way to extend the jQuery attributes selector so that it supports Less Than and Greater Than?

I have some elements which contain a custom attribute SequenceNumber holding an integer. (Before anyone starts I cant use the data property (I think?) because this html is determined at runtime and generated serverside)

Either way. What I am looking to achieve is the ability to select a number of elements that contain a SequenceNumber BETWEEN X AND Y.

So basically something like this

$("#divSequenceGrid ul[SequenceNumber=>'1'][SequenceNumber<='10']").each(func);

Obviously I can do this by going

$("#divSequenceGrid ul").each(function (index, value) {
    //Push into an array those that fit my criteria 
});

But I’m wondering if there is a butter way?

Answer 1

Using .filter()

  $("#divSequenceGrid ul").filter(function(){
        return  $(this).attr("sequenceNumber") >=1 && $(this).attr("sequenceNumber") <=10}).css("color", "red");

Here’s a demo:
http://jsfiddle.net/jFt9N/3/