Question

I really can’t figure out how I would do this. It’s more of a concept question than a code question so I’ll just post an example:

object = $('#div');

function doSomething(object) {
    //iterates through a list and creates a UL with items in corresponding to that list.
    $(body).append("<li id='clickme'>Hello world</li>");
}

function createModal(object) {
    //creates modal dialogue.
    doSomething(object);
    //more stuff
}

$('#clickme').live("click", function() {
    //I need access to object (not the object declared at first,
    //the object passed into doSomething) here.

});

Any ideas how I would do such a thing? doSomething would create a set of LIs and have a parameter passed into it. When those LIs the function creates are clicked, they need to interact with the parameter that’s passed into doSomething. Is there a way to bind them or something?

Sorry if I didn’t make any sense.

Answer 1

You can use jquery data function to associate data to your DOM elements. You then can read those data when handling events.

An alternate way, generally not recommended but useful when you build your html in one big pass and don’t have an easy access to the DOM elements, and only have strings (or keys), is to add an attribute and retrieve it later using jquery’s attr function. Whenever possible I recommend you to use the data function though.