title: jquery validation plugin error placement at the last <td> in form with dynamic rows
body: <p>I have a form where users can add or remove rows of items. Once form is submitted, there are couple of values that I validate like values should be greater than 0 or check for if the field is filled or not and it's working now. What I want right now is that I want to show the error message for that particular line item in the last td for that tr. As users can have multiple rows, errors for that particular row should be in that rows last td. Can someone please help me how can I achieve that?</p>
  
  <p>My current error placement code for input fields and select fields is this:</p>
  
  <pre><code>$("#ItemsForm").validate({
      errorPlacement: function(error, element) {
      error.appendTo(element.next());
      console.log(error);
  },
  highlight: function(element, errorClass) {
             $(element).addClass(errorClass).parent().children("select").addClass(errorClass);
  }
  });
  </code></pre>
  
  <p>HTML code for one of the scenario where I have two items selected is:</p>
  
  <pre><code>&lt;table class="width100" id="tableDiv"&gt;
  &lt;tbody&gt;
      &lt;tr&gt;
          &lt;th class="alignCenter"&gt;Item&lt;/th&gt;
          &lt;th class="alignCenter"&gt;Price&lt;/th&gt;
          &lt;th class="alignCenter"&gt;Quantity&lt;/th&gt;
          &lt;th class="alignCenter"&gt;Discount&lt;/th&gt;
          &lt;th class="alignCenter"&gt;&amp;nbsp;&lt;/th&gt;
      &lt;/tr&gt;
  
      &lt;tr id="Row_1"&gt;
          &lt;td class="products alignCenter"&gt;
              &lt;select name="item_1" id="item_1" class="products box-style select-style"&gt;
                  &lt;option value=""&gt;-- select --&lt;/option&gt;          
                      &lt;option value="1001" &gt;Item 1&lt;/option&gt;
                      &lt;option value="1002" &gt;Item 2&lt;/option&gt;
                      &lt;option value="1003" &gt;Item 3&lt;/option&gt;
                      &lt;option value="1004" &gt;Item 4&lt;/option&gt;           
              &lt;/select&gt;
          &lt;/td&gt;
          &lt;td&gt;&lt;input type="text" name="Price_1" id="Price_1" value="999.00" class="text-box-style width95 alignCenter" disabled="disabled" /&gt;&lt;/td&gt;
          &lt;td class="quantity"&gt;&lt;input type="text" name="quantity_1" id="quantity_1" value="1" maxlength="4" class="quantity text-box-style width95 alignCenter"  /&gt;&lt;/td&gt;
          &lt;td class="discount"&gt;&lt;input type="text" name="discount_1" id="discount_1" value="10" maxlength="3" class="discount text-box-style width95 alignCenter discountBox" /&gt;&lt;/td&gt;
          &lt;td class="alignCenter"&gt;&lt;i onclick="addRow(this.form);" title="Add line item" class="fa fa-plus icon-cog" /&gt;&lt;/td&gt;
      &lt;/tr&gt;
  
      &lt;tr id="Row_2"&gt;
          &lt;td class="products alignCenter"&gt;
              &lt;select name="item_2" id="item_2" class="products box-style select-style"&gt;
                  &lt;option value=""&gt;-- select --&lt;/option&gt;          
                      &lt;option value="1001" &gt;Item 1&lt;/option&gt;
                      &lt;option value="1002" &gt;Item 2&lt;/option&gt;
                      &lt;option value="1003" &gt;Item 3&lt;/option&gt;
                      &lt;option value="1004" &gt;Item 4&lt;/option&gt;           
              &lt;/select&gt;
          &lt;/td&gt;
          &lt;td&gt;&lt;input type="text" name="Price_2" id="Price_2" value="3000.00" class="text-box-style width95 alignCenter" disabled="disabled" /&gt;&lt;/td&gt;
          &lt;td class="quantity"&gt;&lt;input type="text" name="quantity_2" id="quantity_2" value="2" maxlength="4" class="quantity text-box-style width95 alignCenter" /&gt;&lt;/td&gt;
          &lt;td class="discount"&gt;&lt;input type="text" name="discount_2" id="discount_2" value="10" maxlength="3" class="discount text-box-style width95 alignCenter discountBox" /&gt;&lt;/td&gt;
          &lt;td class="alignCenter"&gt;&lt;i onclick="removeRow('2');" title="Remove line item" class="fa fa-minus icon-cog" /&gt;&lt;/td&gt;
      &lt;/tr&gt;
  
      &lt;tr&gt;
          &lt;td&gt;&amp;nbsp;&lt;/td&gt;
          &lt;td&gt;&amp;nbsp;&lt;/td&gt;
          &lt;td class="alignCenter"&gt;&lt;input type="submit" name="submit" id="submit" value="Save" class="width75 box-style btn-style" /&gt;&lt;/td&gt;
          &lt;td&gt;&amp;nbsp;&lt;/td&gt;
          &lt;td&gt;&amp;nbsp;&lt;/td&gt;
      &lt;/tr&gt;
  &lt;/tbody&gt;
  </code></pre>
  
  <p></p>