Adding JavaScript

I have a JavaScript code snippet I’d like to add to my website:

$(document).ready(function() {
 
    $('.input-text').on('input', function() {
    
        var valueLength = $(this).val().length;
      
        if (valueLength > 0 ) {
            $(this).closest('.form-row').addClass('display-floating-label');
        } else {
            $(this).closest('.form-row').removeClass('display-floating-label');
        }

    });

});

The code snippet adds a class to WooCommerce checkout fields if the input value is greater than 0 for styling purposes.

I tried adding it at Appearance > Customize > Custom CSS/JS in the Custom JS text box but it does not work. Why?

Are there any other ways to add JS to the website?