in this example you can see a generated HTML-list. On every refresh the script requests the data-file (ajax/test.json) and builds the list again.

The generated file "ajax/test.json" is cached statically. But how can I avoid requesting this file on every refresh?

// source: jquery.com
$.getJSON('ajax/test.json', function(data) {
    var items = [];

    $.each(data, function(key, val) {
        items.push('<li id="' + key + '">' + val + '</li>');
    });

    $('<ul/>', {
        'class': 'my-new-list',
        html: items.
    }).appendTo('body');
});

This doesn't work:

list_data = $.cookie("list_data");
if (list_data == undefined || list_data == "") {
    $.getJSON('ajax/test.json', function(data) {
        list_data = data;
    });
}

var items = [];
$.each(data, function(key, val) {
    items.push('<li id="' + key + '">' + val + '</li>');
});

$('<ul/>', {
    'class': 'my-new-list',
    html: items.
}).appendTo('body');

Thanks in advance!