生成したliに連番をつけてソートする方法

Question

firebaseで時間順に表示するのを指定したけど、リロードや更新する事で順番がバラバラになってしまいます。
なのでjs上でliを生成時に連番をつけてソートで上から順に表示する仕組みを作りたいです。
以下のようにliを生成してidにcolorを指定したけど上手く作動しなかったのでidを付けれていません。
またそこからどのようにして連番順に表示するかを教えて頂きたいです。

$(function(){
    var h=document.getElementById("messages");
    var l=h.getElementsByTagName("li");
    for (var i=0;i<l.length;i++){
    l[i].setAttribute("id","no"+(i+1));
    }
  });

#no1 {
  color: red;
}
#no2 {
  color: orange;
}
#no3 {
  color: green;
}
#no4 {
  color: yellowgreen;
}
#no5 {
  color: blue;
}

Comments

[babu_babu_baboo]

css において li:nth-of-type を利用する