diff --git a/src/js/animation.js b/src/js/animation.js
index bff33b9..38633b5 100644
--- a/src/js/animation.js
+++ b/src/js/animation.js
@@ -41,13 +41,13 @@ import KeyboardUtils from './keyboardUtils.js';
  */
 function ClickAndHold(btnEl, duration, Callbacks) {
     const {onHoldStart, onHoldComplete, onHoldCancel} = Callbacks;
-    let state = initState();
     const startEventsNames = ['mousedown', 'touchstart', 'keydown'];
     const endEventsNames = ['keyup', 'blur', 'mouseup', 'mouseleave', 'touchend', 'touchcancel'];
-    addHoldStartListeners();
-    addHoldEndListeners();
+    let state = initState();
     btnEl.style.setProperty('--hold-duration', duration + 'ms');
     btnEl.setAttribute('data-click-and-hold', '');
+    addHoldEndListeners();
+    addHoldStartListeners();
 
     function initState() {
         return {
diff --git a/src/js/animationFrame.js b/src/js/animationFrame.js
index b92d309..8ec6137 100644
--- a/src/js/animationFrame.js
+++ b/src/js/animationFrame.js
@@ -43,14 +43,14 @@ import KeyboardUtils from './keyboardUtils.js';
  */
 function ClickAndHold(btnEl, duration, Callbacks) {
     const {onHoldStart, onHoldComplete, onHoldCancel} = Callbacks;
-    let state = initState();
-    let animationState = initAnimationState();
     const startEventsNames = ['mousedown', 'touchstart', 'keydown'];
     const endEventsNames = ['keyup', 'blur', 'mouseup', 'mouseleave', 'touchend', 'touchcancel'];
-    addHoldStartListeners();
-    addHoldEndListeners();
+    let state = initState();
+    let animationState = initAnimationState();
     btnEl.style.setProperty('--hold-duration', duration + 'ms');
     btnEl.setAttribute('data-click-and-hold', '');
+    addHoldEndListeners();
+    addHoldStartListeners();
 
     function initAnimationState() {
         return {