How to delete the individual item from the localStorage dynamically

Question

I'm trying to delete the individual items from the localStorage using jquery. Here i'm adding the checkboxes to each and every item in the listivew for removing the seleted checkbox's items have to delete from localStorage but its not working correctly.

Updated Code:

$(document).ready( function() {
    $("#section_list").on('click', 'a', function() {
                var item = $(this).find('h2').text();
                var desc = $(this).find('p').text();
                var html = '<p></br><p class="description">' + desc + '</p>';
                $('.addToFavoritesDiv').click(function() {
                    var url = $(location).attr('href');
                    if (!supportLocalStorage())
                    {
                        item = 'No support';
                    }
                    else
                    {
                        try
                            {
                                localStorage.setItem('autosave' + url, item + html);

                            }
                        catch (e)
                            {
                                if (e == QUOTA_EXCEEDED_ERR)
                                {
                                    alert('Quota Exceeded');
                                }
                            }   
                    }
                });
    });

    $('#fav').click(function() {
        fromStorage();
        $("#favoritesList").listview('refresh');
    }); 

    $(document).on('click', '#edit', function() {
        fromGetStorage();
    });
});

function supportLocalStorage()
{       
    return typeof(Storage) !== 'undefined';
}

function fromStorage()
{
    $("#favoritesList").empty();
    $("#favoritesList").listview('refresh');
    for (var i = 0; i < localStorage.length; i++) {
        var url = localStorage.key(i);
            var item = localStorage.getItem(url);
            $("#favoritesList").append('<li id="add"><a href="' + url + '" style="text-decoration:none;color:black">' + item  + '</a></li>').attr('url', url);
    }
    $("#favoritesList").listview('refresh');
}

function fromGetStorage() 
    {   
     $("#favoritesList").empty();  
     $("#favoritesList").append('<input type="checkbox" name="all" id="select" />Select all</br>');
     $("#fav .ui-listview-filter").remove();
        for (var i = 0; i < localStorage.length; i++) {
        var url = localStorage.key(i);
         var item = localStorage.getItem(url);
          $("#favoritesList").append('<li id="add"><div><input type="checkbox" name="check" id="check">&nbsp;<a href="' + url + '" style="text-decoration:none;color:black">' + item + '</a></div></li>').attr('url', url);
        $("#favoritesList").listview('refresh');
 }

$("#select").click(function(event){
    event.stopPropagation();
});
    $('#select').change(function() {
    if($("#select").is(':checked')) {
        $("#add #check").prop("checked", true);
        $('#empty').on('click', function() {
            localStorage.clear();
        $("#favoritesList").listview('refresh');
        });
    }
    else {
        $("#add #check").prop("checked", false);
    }
 });


$("#add #check").click(function(event){
    event.stopPropagation();
});

    $("#add #check").change(function() {
        var chkLength = $('input[name="check"]:checkbox').length;
        var chkdLength = $('input[name="check"]:checkbox:checked').length;
        if (chkLength == chkdLength)
        {
            $('#select').prop('checked', true);
            $('#empty').on('click', function() {
                localStorage.clear();
                $("#favoritesList").listview('refresh');
            });
        }
        else 
        {
            $('#select').prop('checked', false);
        }
        $("#delete").on('click', function() {
                var checked = $('#add #check:checkbox:checked');
                    var url = localStorage.key(checked);
                    localStorage.removeItem(url);
                    $("#favoritesList").listview('refresh');
            $("#favoritesList").listview('refresh');
        });

});

} 

Thanks in Advance.

Answer 1

Are you using boolean values as key? It won't work.

It should be :

localStorage.removeItem('keyName');

or

delete window.localStorage["keyName"]