JQuery does not open Bootstrap modal on mobile(iPhone)

I have a Javascript/JQuery function which is supposed to open a bootstrap modal after an AJAX request.

This works on PC using Chrome but unfortunately it doesn't work on iPhone(Chrome/Safari)

The button:

<button type="button" id="GetEmployees" class="btn btn-primary" onclick="GetEmployees()">
    <span class="glyphicon glyphicon-user">&nbsp;</span>Toevoegen
</button>

The function:

function GetEmployees() {
    $.ajax({
        type: 'post',
        url: appPath + '/TimeRegistration/GetEmployees',
        data: {  },
        success: function (response) {
            if (response != null) {
                alert("Load");
                $("#dialog-project .modal-body").html(response);
                $("#dialog-project").modal("show");
                alert("open");
            }
        },
        error: function (response) {
            alert("Onbekende fout opgetreden")
        }
    });
}

And here is the dialog itself:

<div id="dialog-project" class="modal fade" tabindex="-1" role="dialog" style="color: #333333;">
    <div class="modal-dialog modal-sm">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 id="dialog-title" class="modal-title">Aanmaken nieuwe tijdregel</h4>
            </div>
            <div class="modal-body">
            </div>
        </div>
    </div>
</div>

For some reason on iPhone I get the alert "Load" but the modal isn't showing up and also the last alert is not showing up.

edit2: In order to make the buttons execute the JS at the first place I had to add:

$(document).ready(function () {
    var touchEvent = 'onclick' in window ? 'click' : 'touchstart';
    $('#GetEmployees').on('click touchstart', function () {
        GetEmployees();
    })
})