Datepicker（jQuery）无法在加载特定的javascript函数时加载

Question

I have a peculiar problem.

The datepicker does not work when I load a particular javascript function.

Code: Datepicker

$(function() {
    $('input.datepicker').datepicker();
    });

    $(function () {
    $("#txtFrom").datepicker({
    numberOfMonths: 1,
    onSelect: function (selected) {
        var dt = new Date(selected);
        dt.setDate(dt.getDate() + 1);
        $("#txtTo").datepicker("option", "minDate", dt);
    }
    });
    $("#txtTo").datepicker({
    numberOfMonths: 1,
    onSelect: function (selected) {
        var dt = new Date(selected);
        dt.setDate(dt.getDate() - 1);
        $("#txtFrom").datepicker("option", "maxDate", dt);
    var a = $("#txtTo").datepicker('getDate').getTime();
    b = $("#txtFrom").datepicker('getDate').getTime();
    c = (a - b) / (1000 * 60 * 60 * 24);
    $("#rem").val(c);
            }
    });     
});

Javascript Function(this executes onLoad)

init();
var a;
function init(){
var db = openDatabase('CBDB', '1.0', 'mySpecialDatabaseThatWontWork',10*1024*1024);
db.transaction(function (tx) {
    tx.executeSql('SELECT * FROM user',[], function (tx, results) {
        var rows = results.rows;
        for (var index = 0; index < rows.length; index++) {
            var x = rows.item(index);
            a = results.rows.item(index).empid;
        }
        next();
    });});              
}   
function next(){
var db = openDatabase('CBDB', '1.0', 'mySpecialDatabaseThatWontWork',10*1024*1024);
db.transaction(function (tx) {
    console.log("global"+a);
    tx.executeSql('SELECT * FROM login WHERE manager=?',[a], function (tx, results) {
        var rows = results.rows;
        var msg=" ";
        for (var index = 0; index < rows.length; index++) {
            msg +="<option>"+results.rows.item(index).name+","+results.rows.item(index).empid+"</option>"
        }
        var total= "<div class=\"widh1\"><div style=\"text-align: left;\" class=\"margn1\"><p class=\"dateText\">Employee</p><div class=\"selectParent\"><select id=\"type\" class=\"apply1Text\">"+msg+"</select></div></div></div>";
        document.querySelector('#status').innerHTML +=  total;
    });});
}

I'm not able to spot the mistake. Also the javascript function loads after the HTML content is loaded on to the page.

Answer 1

The problem was that the queryselector was replacing the the entire . I changed it to getElementById. Now its working fine.