Библиотека AOS (анимация при прокрутке) не работает при выборе элементов для анимации с помощью jQuery

Я пытаюсь анимировать элементы H1 для многих страниц, используя AOS (анимация при прокрутке). У меня есть несколько страниц, которые используют заголовок, поэтому я выбираю все заголовки с помощью jQuery. Если я ввожу атрибуты вручную в каждый заголовок, он работает, но не при добавлении их через jQuery. Я выбрал другие элементы с помощью jQuery для их анимации, и они работают. Плитка находится в самом верху каждой страницы. Спасибо!

 <link href="https://unpkg.com/[email protected]/dist/aos.css" rel="stylesheet">
 <script src="https://unpkg.com/[email protected]/dist/aos.js"></script>

 <h1 class="title"> </h1>

 $(document).ready(function () {
    $('.title').attr({
       "data-aos": "zoom-in",
       "data-aos-duration": "2000"
    });

    AOS.init();
 });

 //refresh animations
 $(window).on('load', function() {
    AOS.refresh();
 });