使用'innerHTML'不显示datepicker

Question

I am using datepicker from "Modernizr 2.6.2" and it is so useful.
It works so fine in this example code

  <script>
$(function() {
    if (!Modernizr.inputtypes['date']) {
        $('input[type=date]').datepicker({
            dateFormat: 'yy-mm-dd'
        });
    }
});
</script>
    ...
<input class="datepicker input-usmall" type="date" id="startDate" name="startDate" data-date-format="yyyy-mm-dd" placeholder="click" autocomplete="off" form="addProblem">

However, I met one problem. I found that it is not working in below example.

<td ondblclick="modifySelector(this.id)" id="nof_{{ ownProblem.courseId }}_{{ ownProblem.problemId }}_{{ ownProblem.isAllInputCaseInOneFile }}">{{ ownProblem.isAllInputCaseInOneFile }}</td>`
<script>
function modifySelector(target){
    if(target.substring(0, 3)=="nof"){
        if( document.getElementById(target).innerHTML == "OneFile")
            document.getElementById(target).innerHTML = "MultipleFiles";
        else
             document.getElementById(target).innerHTML = "OneFile";
    }
    else if(target.substring(0, 9)=="startDate"){
        document.getElementById(target).innerHTML = '<input class="datepicker input-usmall" type="date" id="startDate" name="startDate" data-date-format="yyyy-mm-dd" placeholder="click" autocomplete="off" form="addProblem">;
    }
}

</script>

I guess, The difference is whether it has written directly or indirectly by using 'innerHTML' and I think it is about priority or something related with DOM. but I do not know how to solve it clearly.

Answer 1

Solved it.
I added 'onmousedown' event on 'input' tag.
Just like below example.

<script>
if(target.substring(0, 9)=="startDate"){ 
    document.getElementById(target).innerHTML = '<input class="datepicker input-usmall" type="date" id="startDate" name="startDate" data-date-format="yyyy-mm-dd" placeholder="click" autocomplete="off" form="addProblem" onmousedown="datepick();">';
}    

// added here new function
function datepick() {
    if (!Modernizr.inputtypes['date']) {
        $('input[type=date]').datepicker({
            dateFormat: 'yy-mm-dd'
        });
    }
}
</script>

and it works now. Anyone knows another way to solve it, answer me.

Thanks!