Анимация / ссылки на динамические элементы с помощью JQuery

У меня есть несколько динамически созданных элементов, которые я хочу позже оживить. Я знаю, что динамические элементы могут ссылаться на:

$(document).on(event, selector, cb)

но я не уверен, как реализовать это с анимацией. Вот мой код, если он помогает. «state.headings» и «state.text» ссылаются на динамические элементы

var state = {
  sm: () => {return $(window).width() < "576"},
  blocks: [
    $("#first-block"),
    $("#second-block")
  ],
  pairs: [
    $("#first-pair"),
  ],
  headings: [
    $("#first-heading"),
    $("#second-heading"),
  ],
  text: [
    $("#first-text"),
    $("#second-text"),
  ],
  watching: 0,
}

$(window).on("scroll", () => {
  if (state.sm()) {
    if (isInViewport(state.blocks[state.watching])) {
      if (state.headings[state.watching].css("right") !== "0px") {
        state.headings[state.watching].animate({
          right: "0px"
        })
        state.text[state.watching].animate({
          left: "0px"
        }, () => {
          if (state.watching < state.blocks.length -1){
            state.watching++ 
          }
        })
      }
    }
  } else {
    //handle animations for larger devices
  }
})