table jquery problem

table jquery problem

Hi folks

I want to append a row in my table with jquery. The append works but it must be possible to edit that row. I can edit the other rows, but I can't edit the newly added row.

Here is my code:

for adding my article to the table:
  1. $.post('./addArticle.php',{articleid: articleid, info: info, code: code, price: price},function(data){
  2.       if(data != ""){
  3.             $('#addArticle').fadeOut('fast');
  4.             $('#overlay').fadeOut('fast');
  5.             $('#artTable').append(data,function(){
  6.                   $(this).effect("highlight", {"color": "#313131"}, 1000);
  7.             });
  8.       }
  9. })
My addArticle.php contains my insert to the database and gives as response my row that it must append + a hidden field with an id. I use this ID to edit my article.

  1. echo "<input type='hidden' value='$articleid' class='articleid' />";
  2.       echo "<tr>";
  3.             echo "<td id='article'>$articleid</td>";
  4.             echo "<td id='info'>$info</td>";
  5.             echo "<td id='code'>$code</td>";
  6.             echo "<td id='price'>$prijs</td>";
  7.             echo "<td id='field'><input type='checkbox' id='active' value='1' checked='true' /></td>";
  8.             echo "<td><button type='button' id='editArticle'><img src='../images/Edit-icon.png' /></button></td>";
  9. echo "</tr>";
But I can't edit my last added record. After a complete refresh it works, but that is not what I want.

Can somebody help me?