Writing javascript functions with dynamically created data

I'm looking for a way to have a javascript/jquery function that references dynamically created html.

Essentially I have a form that is created dynamically through $('#list').append('an html form'). And then a function that looks something like:

function add_repo(id){
    $.ajax({
        url:'/add_project/',
        datatype:'json',
        data:{'name': $('#'+id).value()},
        success:function(data){
            alert(data);
        },
    })
}

where id is a dynamically created identifier for each form created by the jquery append function.

But add_repo() causes an error in the javascript as 开发者_如何学Pythonthe jquery id identifiers don't exist initially. How should situations like this be handled?

---

change

data:{'name': $('#'+id).value()},

to

   data:{'name': $('#'+id).val()},

---

Make a function that is called at runtime:

function add_repo(id){
    $.ajax({
        url:'/add_project/',
        datatype:'json',
        data:{'name': function() {
           return($('#'+id).value());
         }},
        success:function(data){
            alert(data);
        },
    })
}