Инвертирование строк в динамической таблице HTML с помощью jquery

У меня есть таблица html, которая добавляет строку в последнюю строку с помощью jquery Например

как я хочу это

row1 >> Только что опубликовал

row2 >> опубликовано за 1 минуту до

row3 >> опубликовано на 2 мин. раньше

Но это похоже на

row1 >> опубликовано на 2 мин. раньше

row2 >> опубликовано за 1 минуту до

row3 >> Только что опубликовал

<tbody>
  <table align = "center" style = "width:auto" id = "ex-table">
    <tr id = "tr">
      <center><th>Date of join</th></center>
      <center><th>name</th></center>
      <center><th>designation</th></center>
      <center><th>exprience</th></center>
      <center><th>salary</th></center>
    </tr> 
  </table> 
</tbody>


<script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
    var database = firebase.database().ref().child('user');
    database.on('value', function(snapshot){
        if (snapshot.exists()){
            var content = ' ';
            snapshot.forEach(function(data){
                var val = data.val();
               content +='<tr>';
                content += '<td>' + val.daeofjoin + '</td>';
                content += '<td>' + val.name + '</td>';
                content += '<td>' + val.designation + '</td>';
                content += '<td>'  + val.experience + '</td>';
                content += '<td>'  + val.salary + '</td>';
           content += '</tr>';
            });
            $('#ex-table').append(content)
        }
    });
</script>