title: jquery selector on id returns undefined for id attribute
body: <p>I have an invoice table.  When I change a total amount to be paid, I want to update the "custom" amounts for each record in a table.  My issue is that I want to only change the payment amounts on items that are selected to be paid (a checkbox is selected) </p>
  
  <p>Here's my markup</p>
  
  <pre><code>&lt;table id="invoicetable" class="table"&gt;
      &lt;tr&gt;
          &lt;th&gt;&amp;nbsp;&lt;/th&gt;
          &lt;th nowrap&gt;Invoice&lt;/th&gt;
          &lt;th nowrap&gt;Invoice Date&lt;/th&gt;
          &lt;th nowrap&gt;Due Date&lt;/th&gt;
          &lt;th nowrap&gt;Amount Owed&lt;/th&gt;
          &lt;th nowrap&gt;Payment Amount&lt;/th&gt;
      &lt;/tr&gt;
      &lt;tr id="invoice-20110106-1006-3"&gt;
          &lt;td&gt;
              &lt;input checked="checked" id="select-invoice-20110106-1006-3" name="select-invoice-20110106-1006-3" title="choose to not pay anything on this invoice by unchecking this box" type="checkbox" value="true" /&gt;&lt;input name="select-invoice-20110106-1006-3" type="hidden" value="false" /&gt;
              &lt;input id="invoice-invoice-date-20110106-1006-3" name="invoice-invoice-date-20110106-1006-3" type="hidden" value="1/6/2011 12:00:00 AM" /&gt;
              &lt;input id="invoice-date-due-20110106-1006-3" name="invoice-date-due-20110106-1006-3" type="hidden" value="1/5/2011 12:00:00 AM" /&gt;
              &lt;input id="invoice-open-amount-20110106-1006-3" name="invoice-open-amount-20110106-1006-3" type="hidden" value="281.680000" /&gt;
          &lt;/td&gt;
          &lt;td nowrap&gt;
              &lt;a id="invoice-detail-link-20110106-1006-3" title="click to view invoice details" reportUrl="/Report.aspx?R=Y7QXaCujl%2fldGD1Dnc%40%2fI1B%2feDe2R5sHaszF3VEPpfd31lbsCoJ%2fh2KBORgR4dDx1N%2frHXpmd8GJljmMluJJB%4028%40tkZ%40zJLKKHflYpaLRs*" printableUrl="/Report.aspx?R=Y7QXaCujl%2fldGD1Dnc%40%2fIyRhg5x0ZGIY2AmKFLQWmSVJd1VYBWOs7HG7S0%2fw3WyUlG6lL6XS5jQZm7q1Y52DJv%2f0My5R%2fZ5Ecfet%2fREtaoc*"&gt;20110106-1006-3&lt;/a&gt;
          &lt;/td&gt;
          &lt;td nowrap&gt;1/6/2011&lt;/td&gt;
          &lt;td nowrap&gt;
              &lt;span title="this invoice is past due" class="pastdue"&gt;1/5/2011&lt;/span&gt;
          &lt;/td&gt;
          &lt;td nowrap&gt;$281.68&lt;/td&gt;
          &lt;td nowrap&gt;&lt;a title="click to change payment amount" id="pay-invoice-20110106-1006-3"&gt;$281.68&lt;/a&gt;
              &lt;span id="invoice-payment-20110106-1006-3" style="display:none"&gt;
                  &lt;div style="float:left"&gt;&lt;input class="small invoice-payment-amount" id="payment-amount-20110106-1006-3" name="payment-amount-20110106-1006-3" type="text" value="0" /&gt;&lt;/div&gt; 
                  &lt;div style="float:left"&gt;&lt;img height="1" src="/Content/Images/Spacer.png" width="6" /&gt;&lt;img border="0" id="cancel-payment-20110106-1006-3" src="/Content/images/cross.png" style="cursor:pointer;" title="cancel changes" /&gt;&lt;/div&gt;
                  &lt;input id="full-payment-amount-20110106-1006-3" name="full-payment-amount-20110106-1006-3" type="hidden" value="281.68" /&gt;
              &lt;/span&gt;
          &lt;/td&gt;
      &lt;/tr&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>and here is my script</p>
  
  <pre><code>var amountTimer;
  $('#Amount').keyup(function () {
      clearTimeout(amountTimer);
      amountTimer = setTimeout(function () {
          var amountString = $('#Amount').val();
  
          if (IsNumeric(amountString)) {
              var amount = parseFloat(amountString);
  
              $.each("[id^='select-invoice-']:checked", function () {
                  var invoiceId = $(this).attr('id').substr('select-invoice-'.length);
                  var openAmountString = $('#invoice-open-amount-' + invoiceId).val();
  
                  if (IsNumeric(openAmountString)) {
                      var openAmount = parseFloat(openAmountString);
  
                      if (amount &gt;= openAmount) {
                          $('#pay-invoice-' + invoiceId).click();
                          $('#payment-amount-' + invoiceId).val(openAmount.toFixed(2));
                          amount = amount - openAmount;
                      } else if (amount &lt; openAmount &amp;&amp; amount &gt; 0) {
                          $('#pay-invoice-' + invoiceId).click();
                          $('#payment-amount-' + invoiceId).val(amount.toFixed(2));
                          amount = 0;
                      } else {
                          $(this).click();
                      }
                  }
              });
  
          }
  
      }, 1000);
  });
  </code></pre>
  
  <p>There are other events attached to items in here, like fading the entire tr when unchecked, recomputing the total when the textbox changes, and show/hide the textbox on other click events.  What happens is the <code>$.each</code> selector works, but <code>$(this).attr('id')</code> returns undefined.  This is odd because the selector is working based on the id.</p>