Ich habe mehrere Spalten auf einer Seite, die wie folgt in divs eingeschlossen sind:

<div class="first column" style="width:33%; float: left;"></div>
<div class="column" style="width:33%; float: left;"></div>
<div class="last column" style="width:33%; float: left;"></div>

Ich benutze im Grunde genommen ein Plugin, das Text in Spalten aufteilt und von links nach rechts positioniert. In meinem CSS positioniere ich sie neu, sodass sie übereinander gestapelt sind, und verwende dann eine Abfrage, um jede Spalte aus dem Weg zu räumen. Das Problem ist, dass sie in der falschen Reihenfolge gestapelt werden. Die letzte Spalte ist am Anfang, die erste am Ende.

Hier ist das CSS

#reader .column {
    position:absolute;
    top:0;
    left:0;
    background:#fff;
}

Was kann ich tun, um die Stapelreihenfolge zu ändern? Ist die beste Lösung, um mit jQuery jedem div einen Z-Index hinzuzufügen? Ich bin nicht ganz so, wie ich das machen soll, JS ist nicht meine Stärke. Das kommt mir auch etwas spröde vor. Gibt es eine Möglichkeit, die Stapelreihenfolge einfach umzukehren? Hier ist meine sehr einfache jQuery:

$(function(){
    $('#reader-inner').columnize();
    $('.column').click(function() {
      $(this).clearQueue().animate({left:'-550'},500, 'swing');
    });
});