Trouble with very basic plugin creation

When enqueuing JavaScript or CSS from a plugin’s directory, use plugin_dir_url( __FILE__ ).

Note that plugin_dir_url() does return the URL with a trailing slash, unlike get_template_directory_uri() and get_stylesheet_directory_uri() which do not return the URL with a trailing slash. get_template_directory_uri() and get_stylesheet_directory_uri() are more commonly used in themes and child themes respectively.

Here is an updated version of test_plugin(). It works.

add_action( 'wp_enqueue_scripts', 'test_plugin' );
function test_plugin() {
    wp_enqueue_script( 'change_button', plugin_dir_url( __FILE__ ) .  'change_button.js', array( 'jquery' ), '1.0.0', 1 );
}

There was also a small fix needed for the JavaScript. #unique_button should be in quotes. Finally, it’s a best practice to use .on() instead of .click().

change_button.js:

jQuery( function ( $ ) {
    $( "#unique_button" ).on( "click", function( e ) {
            $(this).fadeOut(1000);
    });
});

tech