jquery cookie issue: $.cookie is not a function

Question

I know this question has been asked multiple times. I looked at many answers but couldn't find a solution.

I am trying to load jquery.cookie.js script. Here is how:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
<script type="text/javascript" src="scripts/jquery.cookie.js"></script>
<script type="text/javascript" src="scripts/javascript.js"></script>

This is my javascript:

$(document).ready(function () {
    var jobStats_class = $.cookie('jobStats');

    // Add toggle feature
    $('.jobStats caption').click(function () {
        $('.jobStats th,.jobStats td').slideToggle('1000');
    });

    $('.ricSubscriptions caption').click(function () {
        $('.ricSubscriptions th,.ricSubscriptions td').slideToggle('1000');

    });

    $('.trthJobStatus caption').click(function () {
        $('.trthJobStatus th,.trthJobStatus td').slideToggle('1000');
    });
});

Thanks for your help!

Answer 1

Since version 2.0, jquery-cookie project has moved to js-cookie project.

Now you can't handle cookies with $ variable (because this library didn't really use special functions of jQuery). Now, you have to use Cookies variable :

Create a cookie

//OLD
$.cookie('name', 'value', { expires: 7, path: '/' });
//NEW
Cookies.set('name', 'value', { expires: 7, path: '/' });

Read a cookie

//OLD
$.cookie('name');
//NEW
Cookies.get('name');

Read all cokies

//OLD
$.cookie();
//NEW
Cookies.get();

Delete a cookie

//OLD
$.removeCookie('name');
//NEW
Cookies.remove('name');

Answer 2

Your script path is the problem. Try this cdn:

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.js"></script>