html5 and Jquery todo list

<!DOCTYPE html>
<html lang="en">
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
        var edit = document.getElementById('edit');

$(edit).blur(function() {
        localStorage.setItem('tododata', this.innerHTML);
});

        //when loads
        if ( localStorage.getItem('tododata') ) {
        edit.innerHTML = localStorage.getItem('tododata');
}


});</script>


    <meta charset="utf-8">
    <title>untitled</title>
</head>
<body>
    <h2> To-Do List </h2>
     <ul id="edit" contenteditable="true">
        <li> Break mechanical cab driver. </li>
        <li> Drive to abandoned factory
        <li> Watch video of self </li>
     </ul>
</body>
</html>