Как наблюдать добавление класса в div

Question

В моем div я хочу наблюдать его класс, поэтому, когда этот класс passed добавляется в мой div, я выполняю некоторую функцию js.

Начальный div: <div id="1" class="allow"></div>

после добавления нового класса: <div id="1" class="allow passed"></div>

моя функция для выполнения:

function fill() {
        jQuery('#check').show();
        jQuery('#check-val').hide();
    }

Answer 1

Вы также можете использовать наблюдателя мутации в этом div, чтобы определить, когда класс добавляется.Обратите внимание на использование наблюдателей мутаций .. https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver

    var observer = new MutationObserver(function(mutations) {
       mutations.forEach(function(mutation) {
         if (mutation.attributeName === "class") {
            if ($(mutation.target).hasClass('passed')){
                    alert("passed class was added");
                    fill();
           }
         }
     });
  });

observer.observe(document.getElementById('1'), {
  attributes: true
});

Вот jsfiddle https://jsfiddle.net/e37am2hq/