jquermobile javascript not working

jquermobile javascript not working

i have a proble; maybe a mystake, im working in a to-do aplication, the aplication have one page that contain one panel and one list and the code js insert a new entry from a form; when the page load i can see all the entrys, when the function taht add tre new entry works and the page is reload i cant see the entries in the list view the 

this is html code

<!--Declaracion del tipo de documento como HTML5-->
<!DOCTYPE html>
<html> 
<head> 
<title>Tareas</title> 
<meta name="viewport" content="width=device-width, initial-scale=1"> 

<!--Llamadas a las librerias JS de jQuery, jQuery Mobile y a su hoja de estilos CSS -->
        <link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.1/jquery.mobile-1.4.1.min.css" />
        <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
        <script src="http://code.jquery.com/mobile/1.4.1/jquery.mobile-1.4.1.min.js"></script>
        

        <script src="funciones.js"></script>

</head> 
<body> 
<div data-role="page" id="home">
    <div data-role="panel" id="panel1" data-position="left" data-display="reveal"data-theme="a">
        <form  id="frmCadastre" >
            <div data-role="fieldcontain" data-controltype="textarea">
                <label for="textarea1">
                    Que Hacer
                </label>
                <textarea name="" id="textarea1" placeholder=""></textarea>
            </div>
            <div data-role="fieldcontain" data-controltype="dateinput">
                <label for="dateinput2">
                    Cuando
                </label>
                <input name="" id="dateinput2" placeholder="" value="" type="date">
            </div>
            <div data-role="fieldcontain" data-controltype="dateinput">
                <label for="dateinput3">
                    A que Hora
                </label>
                <input name="" id="dateinput3" placeholder="" value="" type="time">
            </div>
            <input type="submit" value="Aceptar"  >
        </form>
    </div>
    <div data-role="content">
        <a data-controltype="panelbutton" data-role="button" href="#panel1" data-icon="bars" data-iconpos="left">
            Tareas
        </a>
        
        <ul data-role="listview" data-divider-theme="b" data-inset="true" id="tblList">
          <li>primer</li>
          <li>segundo</li>
        </ul>
    </div>
</div>

</body>
</html>



and this is the js code

$(document).on('pageinit','#home', function(){ 
        
        var notas = localStorage.getItem("notas");
        notas = JSON.parse(notas);
        if(notas == null)  notas = [];
        $("#tblList").html("");

        for(var i in notas){
                var not = JSON.parse(notas[i]);
                $("#tblList").append('<li><a href="#" >'+ i +
                   //     ""+not.fecha+"<br>" + 
                // ""+not.hora+"<br>" + 
                 //       ""+not.texto+"<br>" + 
                        '</a></li>');
        }
        $("#tblList").listview('refresh');
        $("#frmCadastre").bind("submit",function(){
            var nota = JSON.stringify({
                    texto  : $("#textarea1").val(),
                    fecha : $("#dateinput2").val(),
                    hora : $("#timeinput2").val()
            });
            notas.push(nota);
            localStorage.setItem("notas", JSON.stringify(notas));
          //  alert("Nota guardada.");      
       });        
        
});