Passing Variables To onChange Event with jQuery .change()
<p>I'm writing a simple web application and have hit a stumbling block of sorts - I've already found a workaround, but I'd like to understand what I'm doing wrong having scoured the jQuery documentation.</p>

<p>I have a function, that when called from the page, inserts a table row:</p>

<pre><code>var rowCount = 0;
function addRow(tbody){
    $("#"+tbody).append(
        $('&lt;tr&gt;').attr('id','row_'+rowCount).append(
            $('&lt;td&gt;').append('Content'),
            $('&lt;td&gt;').append($('&lt;input&gt;').addClass('text').attr('readOnly','readOnly')),
            $('&lt;td&gt;').append($('&lt;input&gt;').addClass('text').attr('readOnly','readOnly')),
            $('&lt;td&gt;').attr('id','barcode_cell'+rowCount),
            $('&lt;td&gt;').append($('&lt;input&gt;').addClass('text').addClass('quantity').attr('maxLength',3)),
            $('&lt;td&gt;').append($('&lt;select&gt;').change(function(){isMissing(this,rowCount)}))        
            )
    );
}
</code></pre>

<p>Where I am primarily concerned with the final <code>&lt;select&gt;</code> box and it's onChange event. My isMissing function:</p>

<pre><code>function isMissing(elem, counter){
  alert(elem.value);
  alert(counter);
}
</code></pre>

<p>What happens is the selected value of the  box alerts as expected, however, the row number <strong>always</strong> alerts the latest row, regardless of which row is calling it. Instead I want it to hold the value of the rowCount variable as it was when the row was introduced, not the latest value of the variable after I have added additional rows. </p>

<p>What am I doing wrong? How do I force the variable to remain static? I have to use a global variable as there is more than one function that adds rows to more than one table, this is the only way I can ensure each row in any table has a unique identifier.</p>
