diff --git a/app/assets/stylesheets/new_design/motivation.scss b/app/assets/stylesheets/new_design/motivation.scss
index 52781f9b2..5adcbc78b 100644
--- a/app/assets/stylesheets/new_design/motivation.scss
+++ b/app/assets/stylesheets/new_design/motivation.scss
@@ -2,7 +2,6 @@
 @import "constants";
 
 .motivation {
-  display: none;
   padding: $default-padding;
   color: $black;
   width: 450px;
diff --git a/app/javascript/new_design/state-button.js b/app/javascript/new_design/state-button.js
index 0f0983a41..da47340fd 100644
--- a/app/javascript/new_design/state-button.js
+++ b/app/javascript/new_design/state-button.js
@@ -1,12 +1,12 @@
-import $ from 'jquery';
+import { show, hide } from '@utils';
 
 export function showMotivation(event, state) {
   event.preventDefault();
-  $(`.motivation.${state}`).show();
-  $('.dropdown-items').hide();
+  show(document.querySelector(`.motivation.${state}`));
+  hide(document.querySelector('.dropdown-items'));
 }
 
 export function motivationCancel() {
-  $('.motivation').hide();
-  $('.dropdown-items').show();
+  document.querySelectorAll('.motivation').forEach(hide);
+  show(document.querySelector('.dropdown-items'));
 }
diff --git a/app/views/new_gestionnaire/dossiers/_state_button_motivation.html.haml b/app/views/new_gestionnaire/dossiers/_state_button_motivation.html.haml
index d72c793e7..99a6dfc88 100644
--- a/app/views/new_gestionnaire/dossiers/_state_button_motivation.html.haml
+++ b/app/views/new_gestionnaire/dossiers/_state_button_motivation.html.haml
@@ -1,4 +1,4 @@
-.motivation{ class: popup_class }
+.motivation.hidden{ class: popup_class }
   %h3
     %span.icon{ class: popup_class }
     #{popup_title}