jQuery基本身份验证不发送标头

I am querying an XML file with PHP to generate a thumbnail gallery, when the user clicks the thumbnail the browser should pull the image from the link and display it in a preview area. The problem I am having is when I click the thumbnail image the pop up box is displaying asking to be authenticated. I have written this code to send a http header in the click event.

jQuery(document).ready(function($){
    jQuery('.id<?php echo $item[0][0]; ?>').click(function() {
        jQuery.ajax({
            url: "<php echo $item[5][0];?>",
            beforeSend: function (xhr) { xhr.setRequestHeader ("Authorization", "Basic <?php echo $base64; ?>") },
            type: "POST",
            async: true,
            crossDomain: true,
            data: {}
        })

    });
});

the $item arrays are created by a foreach loop in PHP. The url: $item[5][0] contains the url link to the image that is to be displayed.

[edit] the image is hosted on a different domain. If the user authenticates in in the browser the image will display in the preview box. If the user does not authenticate (which is what the jquery script is supposed to do) they cannot view the image (access denied).