Im getting a uncaught typeerror . i dono know what i am doing wrong. will you please explain this to me?

Im getting a uncaught typeerror . i dono know what i am doing wrong. will you please explain this to me?

This is my jquery code: 

$(document).ready(function(){

$("#btn-1").click(function(){
$(".location").slideToggle("slow");
});

$("#sub").on("click",function(){
$(this).remove();
$("h5").text("Thanks for your comment. Your comment is submitted");
});

$(".lists li").hover(function(){
$("span").show();
});
$("#ri li #app").click(function(){
$("#ri li #app").show();
$("#list1 li").slideToggle("slow");
});

$("#ri li #ent").click(function(){
$("#ent").show();
$("#list2 li").slideToggle("slow");
});

$("#ri li #des").click(function(){
$("#des").show();
$("#list3 li").slideToggle("slow");
});
});
(function($) {
    $(function() {
        var jcarousel = $('.jcarousel');

        jcarousel
            .on('jcarousel:reload jcarousel:create', function () {
                var carousel = $(this),
                    width = carousel.innerWidth();

                if (width >= 600) {
                    width = width / 3;
                } else if (width >= 350) {
                    width = width / 2;
                }

                carousel.jcarousel('items').css('width', Math.ceil(width) + 'px');
            })
            .jcarousel({                                                /* im getting the error here*/
                wrap: 'circular'
            });

        $('.jcarousel-control-prev')
            .jcarouselControl({
                target: '-=1'
            });

        $('.jcarousel-control-next')
            .jcarouselControl({
                target: '+=1'
            });

        $('.jcarousel-pagination')
            .on('jcarouselpagination:active', 'a', function() {
                $(this).addClass('active');
            })
            .on('jcarouselpagination:inactive', 'a', function() {
                $(this).removeClass('active');
            })
            .on('click', function(e) {
                e.preventDefault();
            })
            .jcarouselPagination({
                perPage: 1,
                item: function(page) {
                    return '<a href="#' + page + '">' + page + '</a>';
                }
            });
    });
})(jQuery);




My script tag:

        <script type="text/javascript" src="../../dist/jquery.jcarousel.js"></script>
        <script type="text/javascript" src="application.js"></script>