Capturing value of variable at time of .append

Capturing value of variable at time of .append

I have a for loop that generates a .append line for each item in an array.  This loop is
writing out a deli order, where each item on the array is an item on the order.  One
of the things in the appended line is a delete button  that lets the user delete that particular item
in the array. The .append looks like this:

$('div#container').append('<input type="button" class="dltBtn" value="Delete" onmouseup="dlt(' + i + ' )"  />');

The thing I'm looking for some explanation on is the dlt(' + i + ').   dlt() is the delete function
and it needs to receive the number of the item on the order array that this line is being generated
for.  If I code dlt(i) the function is passed the value of i at the time the delete button is
clicked, which is after the entire order has been displayed and so is one plus the number of the
last item on the array. Someone from this forum suggested the dlt(' + i + ') form to capture the
value of i at the time the line was being generated, but I don't really understand why this works. 

Could someone who does understand this perhaps write a few lines about why this captures the i that
I want?  I certainly wouldn't have thought to write this on my own.

Thanks.