javascript - Using Ajax callback variable values in JQuery dynamic click handlers -

I am querying a simple Ajax that retrieves a variable-length list of values ​​as JSON data . I am trying to create a list based on this data which has click-functions based on the values ​​received from the JSN query. I can correct this by writing like HTML and methods like HTML:

< Pre> function loadFooList () {var list_area = $ ("# sidebar"); List_area.html ("& lt; ul & gt;") $ Ajax ({Type: 'GET', url: '/ data / foo / list', datatype: 'Jason', success: function (JSN) {$ .each (Json, function (i, item) {var link_id = " Choosesfoo "+ item.id; list_area.html (list_area.html () +"

");}); list_area.html (list_area.html () + "& lt; / ul & gt; ; ");}}); }

I do not like to write onClick-Function in HTML and I also want to learn how to create this functionality through the JQuery click-function.

The problem is obviously variable-scrooping. My inexperienced effort will not work here clearly because the click occurs when they are not variable:

  function loadFooList2 () {Var list_area = $ ("# sidebar"); Var link_ids = array (); List_area.html ("& lt; ul & gt;") $ Ajax ({Type: 'GET', url: '/ data / foo / list', datatype: 'Jason', success: function (JSN) {$ .each (Json, function (i, item) {var link_id = " Selectfoo "+ item.id; list_area.html (list_area.html () +" 
 gt; & lt; a href = '#' id = '"+ link_id +"' & gt; "+ item Name + "& lt; / a & gt; & lt; / li & gt;"); link_ids.push (link_id);}); list_area.html (list_area.html () + "& lt; / ul & gt; ;;); (Link_index = 0; link_index & lt; link_ids.length; link_index ++) Click {$ ("#" + link_ids [link_index]) (function () {warning (link_ids [i]);}) ;}}}); }  

Obviously I just want to do something other than alerting the price, but the alertness-call is there, till I can do it and move on.

I understand that I have to make some kind of handler-function, in which I pass a state-variable it works for a single value (I just store the whole link_ids array properly. But I do not know which is the right value for this link), but how do I do this for arbitrary list of lengths?

Here's an example that I'm trying to copy:

  // Get some data var foobar = ...; // Specify the handler, it requires data as a parameter function handler {// ...} // Click Add Handler and Pass Fobar! $ ('A'). Click (function () {handler (fobar);}); // If you need reference of the original handler, then apply: $ ('A'). Click (function () {handler. Apely (this, [faobar]);});  

And I started pressing the last example here, "If you need a reference to the original handler ..." maybe what I want but I do not know how to go there. I tried to store the current link_id value in it , but it was not successful in using this in the applied job. According to Firefox the required values ​​were still undefined. I'm using JQuery 1.3.2.

So what is the right solution for this relatively basic problem?