Получение списка классов элемента с помощью jQuery

Вы можете использовать document.getElementById('divId').className.split(/\s+/);, чтобы получить массив имен классов.

Затем вы можете перебирать массив и находить нужный класс.

var classList = document.getElementById('divId').className.split(/\s+/);
for (var i = 0; i < classList.length; i++) {
    if (classList[i] === 'someClass') {
        // выполнить какое-то действие
    }
}

jQuery на самом деле не очень помогает в этой ситуации...

var classList = $('#divId').attr('class').split(/\s+/);
$.each(classList, function(index, item) {
    if (item === 'someClass') {
        // выполнить какое-то действие
    }
});

Вы также можете использовать более простой способ:

if ($('#divId').hasClass('someClass')) {
    // выполнить какое-то действие
}

Этот метод удобнее и эффективнее для проверки наличия класса.

Вот плагин jQuery, который возвращает массив всех классов у соответствующих элементов:

;!(function ($) {
    $.fn.classes = function (callback) {
        var classes = [];
        $.each(this, function (i, v) {
            var splitClassName = v.className.split(/\s+/);
            for (var j = 0; j < splitClassName.length; j++) {
                var className = splitClassName[j];
                if (-1 === classes.indexOf(className)) {
                    classes.push(className);
                }
            }
        });
        if ('function' === typeof callback) {
            for (var i in classes) {
                callback(classes[i]);
            }
        }
        return classes;
    };
})(jQuery);

Используйте его так:

$('div').classes();

В вашем случае это вернет:

["Lorem", "ipsum", "dolor_spec", "sit", "amet"]

Вы также можете передать функцию в метод, которая будет вызываться для каждого класса:

$('div').classes(
    function(c) {
        // делаем что-то с каждым классом
    }
);

Вот jsFiddle, который я подготовил для демонстрации и тестирования.

Минифицированный JavaScript

;!function(e){e.fn.classes=function(t){var n=[];e.each(this,function(e,t){var r=t.className.split(/\s+/);for(var i in r){var s=r[i];if(-1===n.indexOf(s)){n.push(s)}}});if("function"===typeof t){for(var r in n){t(n[r])}}return n}}(jQuery);

Попробуйте использовать следующий код:

$("selector").prop("classList")

Этот код возвращает список всех классов, которые в данный момент применяются к элементу.

Вы можете использовать следующий код для получения списка классов элемента и выполнения некоторого действия для каждого класса. Вот пример:

var classList = $(element).attr('class').split(/\s+/);
$(classList).each(function(index) {
    // здесь вы можете выполнять необходимые действия с каждым классом
    console.log(classList[index]); // например, выводим класс в консоль
});

Этот код берет строку с классами элемента, разбивает ее на массив, а затем с помощью each перебирает каждый класс. Не забудьте добавить ваше действие в место, где указаны комментарии.

Обновление:

Как правильно заметил @Ryan Leonard, мой предыдущий ответ не решает полностью проблему, о которой я говорил. Вам необходимо как обрезать строки, так и удалять двойные пробелы с помощью, например, метода string.replace(/ +/g, " "). Либо вы можете разбить el.className на массив и затем удалить пустые значения с помощью, к примеру, arr.filter(Boolean).

const classes = element.className.split(' ').filter(Boolean);

или более современный способ:

const classes = element.classList;

Старое:

С учетом всех приведенных ответов, не забывайте использовать метод .trim() (или $.trim()).

К тому же, поскольку классы добавляются и удаляются, может возникнуть ситуация, когда между строками классов окажется несколько пробелов, например, 'class1 class2       class3'.

В результате это превратится в массив ['class1', 'class2', '', '', '', 'class3'].

Когда вы используете trim, все множественные пробелы удаляются.