I am trying to renumber rows in my table using jQuery
This is the generated HTML
...
...
<tr>
<td><input type="hidden" class="counter" value="5"></td>
<td><input type="text" size="40" id="drugName5" name="drugName[5]" class="drugName required" value=""></td>
<td><input type="text" name="dose[5]" class="dose" value=""></td>
<td><input type="text" name="days[5]" class="days" value=""></td>
<td><input type="image" src="images/delete.png" class="removeRow"></td>
</tr>
....
....
Now clicking the delete.png triggers this function
$(function(){
$("#right").delegate(".removeRow", "click", function(){
var counter = $(this).parent("td").parent("tr").find(".counter").val();
$(this).parent("td").parent("tr").remove();
$(this).parent("td").parent("tr").parent().find("tr").each(function() {
var curIndex = $(this).find(".counter").val();
if (curIndex > counter) {
$(this).find(".counter").attr("value", "" + (curIndex - 1) + ""
//Change Other Numbers Here
//......
);
}
});
Why isn't this working?
Am I navigating the DOM the wrong way?
Or is it a problem the way I am trying to renumber?
Pls help/give references