Возникли проблемы с добавлением aos.js с использованием классов

Question

У меня есть веб-сайт Gutenberg, и я хочу добавить анимацию, которую может контролировать использование, я использую aos (анимация при прокрутке), и я подумал, что если я создам класс, затем перебираю его и добавляю соответствующие значения data-aos, например

$('.aos-fade-up').each(function(i) {
    $(this).attr('data-aos', 'fade-up');
});

Он работает по назначению, добавляет соответствующий атрибут, а содержимое скрывается, но при прокрутке ничего не происходит.

В чем проблема? Атрибут включен, он скрывает содержимое, но при прокрутке ничего не происходит.

Ручка здесь: https://codepen.io/StuartAttain/pen/MWWzVpe

Answer 1

Ты должен init после того, как вы сделаете замены:

https://codepen.io/farinspace/pen/bGVppQb

или сделать AOS.refreshHard(); потом:

https://codepen.io/farinspace/pen/ExVKKrw