Adding AOS animation to all elements with specific class

Question

I want to add AOS animation to all elements that have a class of animate_right. I used this code and it adds all of the html (attributes and classes) to the tag only the animation does not work. Here is my code

  <script src="/js/aos.js"></script>
  <script>
    AOS.init({
      easing: 'ease-in-out-sine'
    });
    
    $(document).ready(function () {
    $(".animate_right").addClass("aos-item aos-init aos-animate");
    $('.animate_right').attr({
        "data-aos": "fade-right",
        "data-aos-once": "false",
        "data-aos-duration": "600"       
    });
</script>

Answer 1

You have to add the attributes before initializing the AOS. Like this:

<script>
    // first add attributes
    $('.animate_right').attr({
        "data-aos": "fade-right",
        "data-aos-once": "false",
        "data-aos-duration": "600"       
    });
    
    // now initialize AOS
    AOS.init();
  </script>