Z-index TOP list

by sas_sam

HTML

<button id="getZList">Click me and see the console!</button>
<div id="container">
    <h1>Title</h1>
    <p>List...</p>
    <ul>
    	<li>1</li>
    	<li>2</li>
    	<li>3</li>
    	<li>4</li>
    </ul>
    <div class="layer">
    	<div class="abs-1000"></div>
        <div class="abs-1010"></div>
    </div>
    <div class="fix-bottom"></div>
</div>

CSS

#container {
	position: relative;
	z-index: 10;
}
h1 {
	font-size: 14px;
	font-weight: bold;
	position: relative;
}
p {
	font-size: 10px;
}
.layer {
	position: absolute;
	z-index: 20;
	top: 0px;
	right: 50px;
}
ul {
	position: relative;
	z-index: 2000;
	list-style-position: inside;
}
ul li {
	background-color: #F00;
	margin-bottom: 5px;
}
.abs-1000 {
	position: absolute;
	z-index: 1000;
	background-color: #0F0;
	height: 200px;
	width: 30px;
	padding-top: 0px;
	padding-left: 0px;
}
.abs-1010 {
	background-color: #00F;
	height: 10px;
	width: 10px;
	padding-top: 10px;
	padding-left: 10px;
	position: absolute;
	z-index: 1010;
	top: 0px;
}
.fix-bottom {
	background-color: #FF0;
	height: 50px;
	width: 30px;
	position: fixed;
	z-index: 1;
}

JavaScript

function getTopZindexes(containerSelector) {
    var indexes = [];
    var elements = [];
    var selector = (containerSelector == "undefined") ? "html *" : containerSelector+" *";

    $(selector).each(function () {
        var index_current = parseInt($(this).css("zIndex"), 10);

        if ($.isNumeric(index_current)) {
            indexes.push(index_current);
            elements.push($(this));
        }
    });
    var tempI;
    var tempE;
    var swap = true;
    for (var i = indexes.length - 1;
    (i > 0) && (swap); i--) {
        swap = false;
        for (var j = 0; j <= i - 1; j++) {
            if (indexes[j] > indexes[j + 1]) {
                tempI = indexes[j];
                tempE = elements[j];
                indexes[j] = indexes[j + 1];
                indexes[j + 1] = tempI;
                elements[j] = elements[j + 1];
                elements[j + 1] = tempE;
                swap = true;
            }
        }
    }
    var top = 10;
    var topReal = (indexes.length >= top) ? top : indexes.length;
    for (var i = 1; i <= topReal; i++) {
        console.log('z-index: ' + indexes[indexes.length - i]);
        console.log(elements[indexes.length - i]);
    }
}

$("#getZList").click(function() {
    getTopZindexes("#container");
});