如何在Wordpress中添加媒体按钮

I am trying to add two buttons that look like this :

I added the Add PDF button first. It worked perfectly. In functions.php I added the following code:

// Add PDF button
function add_pdf_button() {
    echo '<a href="#" id="add-pdf" class="button" title="Add PDF"><span class="dashicons-before dashicons-format-aside wp-media-buttons-icon"></span> Add PDF</a>';
}
add_action('media_buttons', 'add_pdf_button', 14);
// Include JavaScript for button functionality
function include_add_pdf_js_file() {
    wp_enqueue_script('media_button', get_template_directory_uri() . '/js/add-pdf.js', array('jquery'), '1.0', true);
}
add_action('wp_enqueue_media', 'include_add_pdf_js_file');

And in add-image.js I added the following code :

var file_frame;
jQuery('#add-pdf').live('click', function( event ){
    event.preventDefault();
    // If the media frame already exists, reopen it.
    if ( file_frame ) {
        file_frame.open();
        return;
    }
    // Construct our media frame with only pdfs shown
    file_frame = wp.media.frames.file_frame = wp.media({
        title: 'Add PDF',
        multiple: false,
        library: {
            type: 'application/pdf',
        },
    });
    // When something is selected, insert our new link with a custom class into the editor
    file_frame.on( 'select', function() {
        attachment = file_frame.state().get('selection').first().toJSON();
        wp.media.editor.insert('<div class="show-form-container butonrosu"><a class="show-form" href="#">Download the report</a></div><div class="my-form-container"><a class="pdf" href="' + attachment.url + '">' + attachment.title + '</a></div>');
    });
    file_frame.open();
});

As I said, it worked just fine. When I did the same thing to add an Add Image button, both buttons stopped working. The problem is in functions.php because everything stops there.

So my question is : why are these two blocks of code incompatible ?

// Block 1 : Add PDF button
function add_pdf_button() {
    echo '<a href="#" id="add-pdf" class="button" title="Add PDF"><span class="dashicons-before dashicons-format-aside wp-media-buttons-icon"></span> Add PDF</a>';
}
add_action('media_buttons', 'add_pdf_button', 14);
// Include JavaScript for button functionality
function include_add_pdf_js_file() {
    wp_enqueue_script('media_button', get_template_directory_uri() . '/js/add-pdf.js', array('jquery'), '1.0', true);
}
add_action('wp_enqueue_media', 'include_add_pdf_js_file');


// BLOCK 2: Add Image button next to Add PDF
function add_img_button() {
    echo '<a href="#" id="add-img" class="button" title="Add Image"><span class="dashicons-before dashicons-format-aside wp-media-buttons-icon"></span> Add Image</a>';
}
add_action('media_buttons', 'add_img_button', 14);
// Include JavaScript for button functionality
function include_add_img_js_file() {
    wp_enqueue_script('media_button', get_template_directory_uri() . '/js/add-image.js', array('jquery'), '1.0', true);
}
add_action('wp_enqueue_media', 'include_add_img_js_file');