localStorage обновляется. Как запретить

if (localStorage.getItem('todo')!=undefined){    
        var tasks = [];
        tasks = JSON.parse(localStorage.getItem('todo'));
        for (var key in tasks) {
            $('#list').append("<li >" + tasks[key] + "</li>");
        }
    }
        function SaveTask(){
            var tasks = [];
            $('li.task').each(function(i, el){
                var val = $(el).text();                         
                    tasks.push(val);                        
            }); 
            console.log(tasks); 
            localStorage.setItem('todo', JSON.stringify(tasks));
        }
        function AddTask(){
            var val = $('#new-todo').val();
            var del = $('<a class="del" href="#" />').text('×');
            var li = $('<li class="task" />').html(val).append(del);
            if (val) {
                li.appendTo($('#list'));
                $('#new-todo').val('');                                 
            }
            del.click(function () {
                li.remove();                
            });
        }   
        $('#btn-enter').click(function () {
            AddTask();
            SaveTask();
        });

При перезагрузке страницы отображаются только последнедобавленные, вместо всех. Если var tasks = []; сделать глобальной, идет некорректное сохранение в массив. Тут 2 варианта - скорректировать SaveTask() или localStorage. Рассмотрю все... http://jsfiddle.net/Nata_Hamster/6vhas75k/