About CSS Transition Start and End Events

When you use CSS animations, you can track by JavaScript, when the transition started and ended. Do that with transitionstart and transitionend events, as follows:

const el = document.querySelector('.animated');

el.addEventListener('transitionstart', function() {
    console.log('Animation started');
});

el.addEventListener('transitionend', function() {
    console.log('Animation ended');
});