HTML button not working in table rows jQuery

Question

 $(function() { $('table td').click(function(e) { if (e.target.id === "Sellbtn") { var sell = prompt("Enter the amount you wish to sell"); //problem is here i guess $(this).parent('tr').cells[4].innerHTML = parseInt($(this).parent('tr').cells[4].innerHTML) - sell; } else if (e.target.id === "Deletebtn") { return false; } else { var ask = prompt("Input"); $(this).html(ask); } }); }); 

I have a table with several rows each row has two buttons (Sell and Delete). What i want is when I click on the sell button of a row it gets me the prompt and then the amount entered should get subtracted from the number in cell[4] of that ROW and change the amount in cell[4] to this new amount. This doesn't work obviously so what should i do? And by the way this code gives me the error: Cannot read property '4' of undefined.

Answer 1

If I understand your code correctly then something like this should work:

var td4 = $(this).closest("tr").find("td:eq(4)");
td4.html(parseInt(td4.text()) - sell);

The problem with your code is that $(this).parent('tr').cells is undefined. Also, instead of using .innerHTML (which only works on Javascript objects) you need to use .html() , which works on jQuery selections.