Question

I’m using the jQuery data() function to store data on a series of divs in a format similar to:

{ 
    options: {
        example: {
            option_1: {
                value: "example 1"
            },
            option_2: {
                value: "example 2"
            }
        }
    }
}

I can add new keys and update the data, e.g.

$("#mydiv").data('options',{'example':{} });    // the object is already created in the live version
$("#mydiv").data('options')['example']['option_3'] = { value: "example 3" };

But when I come to use removeData(), FireBug tells me that the key is undefined, e.g.

$("#mydiv").removeData('options')['example']['option_2'];

Any help appreciated!

Answer 1

.removeData(name) removes the previously stored data with the given name, and returns a jQuery object. In your scenario, you don’t want the remove the entire options object, just a specific property of it, so you should be using delete instead:

delete $("#mydiv").data('options')['example']['option_2'];