Checkbox on "change" function does not work in Safari browser at first click

I have this function:

function CompareProduct(product_id) {
    $(document).ready(function() {
        $('#' + product_id).on('change', function() {
            if ($(this).is(':checked')) {
                CheckboxCompare.Add(product_id);
                $('#' + product_id).attr("disabled", true);
            } else if (!$(this).is(':checked')) {
                compare_product_remove(product_id);
                $('#' + product_id).attr("disabled", true);
                $('.compare-product_' + product_id).fadeOut();
            }
        });
    });
}

Which working fine on Chrome, Mozilla, but does not work on Safari. On Safari browser, when click first time just a checbox become selected... when I click second time checkbox deselecting and function works. And when I click again function also working. So first click of the checkbox on Safari does not work. How to solve this problem?