How to set on a new random to x, y when gsap is repeated

Hello i use vue3 and gsap I want to give new x and y whenever gsap repeats. Repeatdelay works well randomly, but without refresh, x and y are always given the same value.

This is my code.

    gsap.set(array.value[i], {
      xPercent: gsap.utils.random(0, 900),
      yPercent: gsap.utils.random(0, 300)
    })
    gsap.to(array.value[i], {
      opacity: 0,
      scale: 2,
      duration: 0.3,
      yoyo: true,
      onComplete () {
        gsap.delayedCall(gsap.utils.random(2, 5, 0.1), () => this.restart())
      }
    })

I want to set new random values of x and y whenever gsap is repeated. Is there a good way for me?

Please let me know if you don't have enough explanation.

Thank for your help.

You can set a new random value for x and y before the animation gets restarted.

const setRandomPosition = item => {
    gsap.set(item, {
        xPercent: gsap.utils.random(0, 900),
        yPercent: gsap.utils.random(0, 300)
    })
}

setRandomPosition(array.value[i]);
gsap.to(array.value[i], {
    opacity: 0,
    scale: 2,
    duration: 0.3,
    yoyo: true,
    onComplete(){
        gsap.delayedCall(gsap.utils.random(2, 5, 0.1), () => {
            setRandomPosition(array.value[i]);
            this.restart()
        })
    }
})