Editing HTML5 LocalStorage through a function - json

Question

I want to be able to add an "Ignore List" with the results being saved on the users browser.
The Ignored List is saved as a JSON array and looks like this:
[{"username":"test_user","date_added":"19/08/13","description":"Don't like this person."},{"username":"test_user_2","date_added":"19/08/13","description":"Don't like this person."}]
And the function required to add the users look like this:
function add_to_ignore_list()
{
var ignored_users = localStorage.getItem("ignore_list"); // returns ignore list
var username = return_current_username(); // returns test_user3
var date = return_current_date(); // returns 19/08/13
var description = prompt("Why do you want to ignore this user?"); // returns desc
add_to_list = {
"username" : username,
"date_added" : date,
"description" : description
};
ignored_users.push(add_to_list);
localStorage["ignore_list"] = JSON.stringify(ignored_users);
$(".user_wrapper").css("background-color","#B40404");
}
For some reason it isn't working and I can't see why Please help.

Answer 1

ignored_users is stored as a string.
When you retrieve it from localStorage, you need to parse it before you use it.
change:
var ignored_users = localStorage.getItem("ignore_list");
to (assumes it had previously been stored):
var ignored_users = JSON.parse(localStorage.getItem("ignore_list"));