跪求高手帮解决下，读取SQLite后，动态加载列表出现的不同步问题

困扰我一周多了，望高手帮忙解决下，不胜感激。
问题：读取SQLite的事务操作总是最后执行(执行顺序如代码中first run ~~ seventh run)
      我的理想状态是second run最后执行，这样就可以在页面刷新时，只加载一次，现在的
       情况是页面先加载完成后，再动态加载列表。
总之我需要一种解决办法，能够从SQLite中读取数据，然后用数据作参数，动态加载列表，
（重点）页面刷新时，动态加载的列表和原网页内容同步显示。     
如下代码：
<script type="text/javascript">
$(function(){
    alert("third run");
})$("#pageId").live("pagebeforecreate",function(){   
    db = window.openDatabase("ikea.db", "1.0", "ikea_database", 1024 * 1024);    alert("first run");
    db.transaction(function(tr) {
    var query1  = "CREATE TABLE IF NOT EXISTS Catalog_tbl";
    tr.executeSql(query1, [] ,loadItems);
    alert("fourth run");
    });
alert("second run");
}); function loadItems() {
    alert("fifth run");
    db.transaction(function(tr) {
        var query = "select * from Commodity_tbl where cmd_tpbId = '1' ";
        tr.executeSql(query, [], loadItems_onResult);
    });
}function loadItems_onResult(tr, rs) {
    alert("sixth run");
    for (var i = 0; i < rs.rows.length; i++) {
        var row = rs.rows.item(i);
        var cmd_id = row.cmd_id;
        var cmd_commodity = row.cmd_commodity;
        alert("seventh run");
        $("#si_ul").append("<li id='"+ cmd_id +"'></li>"); 
        $("#" + cmd_id).append("<a href='link_page/Template_page.htm'>" 
                                + cmd_commodity + "</a>");
    }
}
</script>