How to save the new order of a reordered list locally? (Javascript/Jquery--Not Sortable Plugin)

I have an in progress fiddle saved here (that you can see I've edited a painfully many number of times trying to figure this out): http://ift.tt/1JrQbj7

I have a basic set of html I've been working with to test this:

<div id="inventoryBlock">
    <div class="list_bg">Hello</div>
    <div class="list_bg">World</div>
    <div class="list_bg">Whats</div>
    <div class="list_bg">Going</div>
    <div class="list_bg">Down?</div>
</div>
<a href="#" id="undo">Undo</a>

<div id="echo"></div>

The idea is to randomly sort this list on a user's first visit to the page only. Then anytime they return to this page within the set time, they will see the list sorted exactly as it was when they first visited the page (the same order as that first random sort). Here is the script I've been working on:

//var orig = $("#inventoryBlock").children(".list_bg");
$(document).ready(function () {
    var now = (new Date()).getTime();
    var lastTime = 0;
    var lastTimeStr = localStorage["lastTime"];
    if (lastTimeStr) lastTime = parseInt(lastTimeStr, 10);
    if (now - lastTime > 1 * 60 * 1000) {
        reorder();
    } else {
        $("#inventoryBlock").html(elements);
    }
    localStorage["lastTime"] = "" + now;
});
//function 'reorder' is declared
function reorder() {
    //variable 'grp' is defined as the .list_bg elements
    //variable 'grp' is an empty jquery object, not an array--an array has '[]' in the variable
    var grp = $("#inventoryBlock").children();

    //variable 'cnt' is defined as the number of .list_bg elements
    var cnt = grp.length;

    //variables 'temp' and 'x' are declared
    var temp, x;
    //variable 'i' is declared and defined as 0, a loop is initiated to continue until the value of 'i' is no longer less than the value of 'cnt'

    // While there remain elements to shuffle...
    for (var i = 0; i < cnt; i++) {
        //the 'temp' variable is defined as the current .list_bg item, assigned an order, and set as an array value using the associated 'i' value

        // Pick a remaining element...
        //temporaryValue = array[currentIndex]
        temp = grp[i];
        //the 'x' value is assigned randomly based on the 'cnt' value (use javascript random function)
        x = Math.floor(Math.random() * cnt);

        // And swap it with the current element.
        //array[currentIndex] = array[randomIndex];
        grp[i] = grp[x];
        //array[randomIndex] = temporaryValue;
        grp[x] = temp;
    }
    //returns empty jquery object
    //removes original object
    $(grp).remove();
    //appends new object/replacement object
    $("#inventoryBlock").append($(grp));
    console.log($(grp).get());
    var elements = $('#inventoryBlock').find('.list_bg');
}

function orderPosts() {
    $("#inventoryBlock").html(orig);
}

$("#undo").click(function (e) {
    e.preventDefault();
    orderPosts();
});

The bottom function orderPosts() is not really relevant here, and the echo div I was trying to use to echo values so I could better figure out what to do. The inventoryBlock is the only div that matters. The whole idea is to save the list order to data after that first page visit, and to load that data when they revisit the page within that set time period. I'm stuck on how to achieve this. I've tried too many suggestions to even recount, have tried commenting and recommenting the code so that I could figure it out step by step. I'm just missing something. Could someone point me in the right direction?