How Do I Search Nested Divs Using Regex For Class Names

I want to search for nested divs like these in my DOM

Solution 1:

Use the Attribute Contains Selector:

$("div[class*='columns'] div[class*='columns']")

Edit:

If you want that exact functionality you might want to extend the jQuery selector engine:

$.extend($.expr[':'], {
    classEndsWith: function(e, i, meta) {
        var found = false
        var classes = e.className.toLowerCase().split(' ');
        var suffix = meta[3].toLowerCase();
        $.each(classes, function(i, c) {
            // Check if className ends with value in suffix
            if (c.indexOf(suffix, c.length - suffix.length) !== -1) {
                found = true;
                return false;
            }
        });
        return found;
    }
});

var element = $('div:classEndsWith(columns) div:classEndsWith(columns)');

See JSFiddle.

Solution 2:

$("div[class$='columns'] div[class$='columns']")

Is working. Check the fiddle

Share