jQuery can't access this inside change event
<p>I am having an issue trying to get a hold of a cascading combo box on the outer combo box change event.  you can add and remove rows from a table so there could be any number of rows.  Inside each row are 2 combo boxes.  1 is for customer and 1 is for contact.  I have a change event firing on customer combo box that goes and pulls the valid contacts for that customer.  Below is the html for the table</p>

<pre><code>&lt;tr class="ClassAttendee"&gt;      
&lt;td&gt;
    &lt;select class="Customers valid" id="Attendees_0__Customers"
    name="Attendees[0].Customers"&gt;    
        &lt;option value="1517"&gt;Woodstock&lt;/option&gt;
        &lt;option value="1518"&gt;Woolwich&lt;/option&gt;
        &lt;option value="1519"&gt;Yarmouth&lt;/option&gt;
        &lt;option value="1520"&gt;York&lt;/option&gt;
    &lt;/select&gt;
&lt;/td&gt;
&lt;td&gt;
     &lt;select class="Contact"&gt;
         &lt;option value=""&gt;Choose Attendee...&lt;/option&gt;
     &lt;/select&gt;
&lt;/td&gt;
&lt;td&gt;
     &lt;input data-val="true" data-val-required="The Attended field is required."
     id="Attendees_0__Attended" name="Attendees[0].Attended" type="checkbox"
     value="true"&gt;&lt;input name="Attendees[0].Attended" type="hidden" value="false"&gt;
     &lt;span class="field-validation-valid" data-valmsg-for="nestedObject.Attended" data
     -valmsg-replace="true"&gt;&lt;/span&gt;
&lt;/td&gt;
&lt;td&gt;
     &lt;input class="FeePaid" data-val="true" data-val-required="The Fee Paid field is
     required." id="Attendees_0__FeePaid" name="Attendees[0].FeePaid" type="checkbox"
     value="true"&gt;&lt;input name="Attendees[0].FeePaid" type="hidden" value="false"&gt;
     &lt;span class="field-validation-valid" data-valmsg-for="nestedObject.FeePaid" data
     -valmsg-replace="true"&gt;&lt;/span&gt;
&lt;/td&gt;
&lt;td&gt;
     &lt;input class="CheckNumber" id="Attendees_0__CheckNumber"
     name="Attendees[0].CheckNumber" type="text" value=""&gt;

     &lt;span class="field-validation-valid" data-valmsg-for="nestedObject.CheckNumber"
     data-valmsg-replace="true"&gt;&lt;/span&gt;
&lt;/td&gt;
&lt;td&gt;
    &lt;input class="mark-for-delete" data-val="true" data-val-required="The Delete field
    is required." id="Attendees_0__Delete" name="Attendees[0].Delete" type="hidden"
    value="False"&gt;

    &lt;a href="#"
    onclick="javascript:removeNestedForm(this,'tr.ClassAttendee','input.mark-for
    -delete');return false;"&gt;Remove&lt;/a&gt;
&lt;/td&gt;
&lt;/tr&gt;
</code></pre>

<p>Each row looks like this where the first 2 cells contain drop downs.  The first for Customer and the second for Contacts.  If I just use a selector of $("Contact") I can update the combo boxes with the correct options so I know this works but I need to specify the row because when I just use that selector all rows get updated.</p>

<p>?Below is the JQuery I am trying to use</p>

<pre><code> $('.Customers').change(function (e) {
        var selectedCustomer = $(this).val();
        if (selectedCustomer != null &amp;&amp; selectedCustomer != '') {
            $.getJSON('@Url.Action("GetAllSelectedCustomer", "CustomerEmails")', { id: selectedCustomer }, function (contacts) {
                var contactSelect = $(this).parent().next().children(".Contact");
                contactSelect.empty();
                $.each(contacts, function (index, contact) {
                    contactSelect.append($('&lt;option/&gt;', {
                        value: contact.ID,
                        text: contact.Name
                    }));
                });
            });
        }
    });
</code></pre>

<p>The speicif line I am having issues with is </p>

<pre><code>var contactSelect = $(this).parent().next().children(".Contact");
</code></pre>

<p>If I use a selector to first select the customer drop down box instead of using this and then use the rest of the line I can select the contacts drop down.  I don't understand why this is not working and I also have no ideas on how to select the specific drop down list on the row I am dealing with for the change event if I can't use the this object.  </p>

<p>Any ideas would be greatly appreciated. </p>
