Question

Say I have elements like these:

<h1 data-myapp-title>Title</h1>
<p data-myapp-description>Description</p>

How can I filter them by attribute name that is “data-myapp-*” with jQuery?

Answer 1

Not bullet-proof, but this should get you close. I made it in to a selector to make it a bit easier, but this is the general premise:

• Returns any elements that have an attribute that matches the selector
• Allows you to specify wildcard or regex pattern. (Simple testing worked, but probably should do a lot more)

(function($){
    $.expr[':']['attr'] = function(obj,index,meta,stack){
        var re = new RegExp(meta[3]), m = false;
        for (var a = 0; a < obj.attributes.length; a++){
            m |= re.test(obj.attributes[a].name);
        }
        return m;
    };
})(jQuery);

$(':attr(data-myapp-*)').css('color','#f0f');

jsFiddle