Why a cant use play/pause buttons?

[TreeFall1]

JS:

let elements = document.querySelectorAll(".el");
    let playBtn= document.querySelector('.play');
    let pauseBtn= document.querySelector('.pause');
    const circle = anime({
        targets: elements,
        left: "240px",
        borderRadius: ["0%", "50%"],
        duration: 1000,
        easing: 'easeInOutQuad',
        autoplay: false,
        // loop: true,
    });
playBtn.onclick = animation.play;
pauseBtn.onclick = animation.pause;

HTML:

Play Pause

Why my play/pause buttons doesnt work? Its says: Uncaught ReferenceError: animation is not defined

[juliangarnier]

It's because the animation variable is never declared, your animation variable is circle. Do this instead:

playBtn.onclick = circle.play;
pauseBtn.onclick = circle.pause;