title: Access an item of the loop out of the loop
body: <p>So i have a couple of item that iterate through from database using Jquery and for each of them I output a button to select that specific item and when I click on that row's button I want to POST the details to the controller in MVC. </p>
  
  <pre><code>$.each(data, function (i, val) {
      var item = $('&lt;div&gt;&lt;/div&gt;');
      item.append('&lt;h2&gt;&lt;a&gt;' +val.Name+ '&lt;/a&gt;&lt;/h2&gt;');              
      item.append('&lt;a id="button"&gt;SELECT&lt;/a&gt;');
      tab.append(item);
  });
  </code></pre>
  
  <p>And I have this function for the button:</p>
  
  <pre><code>$('#myId').on('click', 'a#button', function () {
      alert('Name'+val.Name+'');  
      var item = { Name: val.Name };
      $.ajax({
          type: "POST",
          contentType: "application/json; charset=utf-8",
          data: "{item:" + JSON.stringify(item) + "}",
          url: "/Person/GetData"
      });
  });
  </code></pre>
  
  <p>If I add the function inside the loop it will iterate as many times as there are items in there. So how can I deal with this in order to send post the name after I press SELECT button?</p>