Mostrar <li> por orden en lugar de random

[maxi_lance]

Que tal, adapte un script de la web que funciona OK. Muestra el contenido de los <li> que haya cargado de a uno por vez por un lapso de tiempo determinado. Todo esto lo hace aleotoriamente, es decir, con random.

Lo que necesito es que las muestre segun un orden, del menor al mayor por ejemplo. COmo podria editar el script para incorporarle numeros a los divs y que la funcion js lo interprete ?

El ejemplo lleva includio el jquery.js.

Código HTML:

<ul id="tips">
	<li>... if you want to become a better coder you need to eat your vegetables?</li>
	<li>... it takes more time to code a web page then to make a pizza?</li>
	<li>... you should validate your code?</li>
	<li>... jQuery is your friend? For real!</li>
	<li>... no matter what some people claim, you can't learn CSS in 3 hours?</li>
</ul> 

Código HTML:

#tips, #tips li{
	margin:0;
	padding:0;
	list-style:none;
	}
#tips{
	width:250px;
	font-size:16px;
	line-height:120%;
	}
#tips li{
	padding:20px;
	background:#e1e1e1;
	display:none; /* hide the items at first only */
	}

Código Javascript:

<script type="text/javascript">
 
this.randomtip = function(){
 
    var pause = 3000; // define the pause for each tip (in milliseconds) 
    var length = $("#tips li").length; 
    var temp = -1;      
 
    this.getRan = function(){
        // get the random number
        var ran = Math.floor(Math.random()*length) + 1;
        return ran;
    };
    this.show = function(){
        var ran = getRan();
        // to avoid repeating
        while (ran == temp){
            ran = getRan();
        }; 
        temp = ran;
        $("#tips li").hide();   
        $("#tips li:nth-child(" + ran + ")").fadeIn("fast");        
    };
    
    show(); setInterval(show,pause);
    
};
 
$(document).ready(function(){   
    randomtip();
});
 
</script>