how to disable bootstrap prev(next) arrow on first(last) slide

$('.carousel').carousel({
    interval: false,
})

$(document).ready(function () {               // on document ready
    checkitem();
});

$('#myCarousel').on('slid.bs.carousel', checkitem);

function checkitem()                        // check function
{
    var $this = $('#myCarousel');
    if ($('.carousel-inner .item:first').hasClass('active')) {
        // Hide left arrow
        $this.children('.left.carousel-control').hide();
        // But show right arrow
        $this.children('.right.carousel-control').show();
    } else if ($('.carousel-inner .item:last').hasClass('active')) {
        // Hide right arrow
        $this.children('.right.carousel-control').hide();
        // But show left arrow
        $this.children('.left.carousel-control').show();
    } else {
        $this.children('.carousel-control').show();
    }
}