jQuery only loads after refresh

jQuery only loads after refresh

Hi,

I am using WordPress on my site and I have created a custom jquery in order to add the qty input fields again:

  1. jQuery(document).ready(function($){
  2.     $('.quantity').on('click', '.plus', function(e) {
  3.         $input = $(this).prev('input.qty');
  4.         var val = parseInt($input.val());
  5.         $input.val( val+1 ).change();
  6.     });

  7.     $('.quantity').on('click', '.minus', 
  8.         function(e) {
  9.         $input = $(this).next('input.qty');
  10.         var val = parseInt($input.val());
  11.         if (val > 0) {
  12.             $input.val( val-1 ).change();
  13.         } 
  14.     });

I embedded it into my header like this: 

  1. function state_dropdown_scripts() {
  2.     
  3. wp_enqueue_script( 'theme_functions_scripts', get_stylesheet_directory_uri() . '/js/scripts-min.js', array(), null, false );
  4. }

Whenever i add a product into my cart and try to click on one of the qty input fields, it does not add or remove any quantities. It works right after I refresh the page:

Do you have an idea on how to fix that?

Thanks!!