获取具有动态ID值的元素的ID

Question

I am a newbie in Jquery. I have a table in my webpage which shows the contents of a user table from the database.I have also created an edit button and Delete button for each row of data.I need the id of each edit and delete button for writing code for editing and deleting the records in the database as well as implementing this changes in the table in the webpage also.

   $query = mysqli_query($con,"SELECT * FROM user_details");
      while($row = mysqli_fetch_array($query))
      {
          echo "<tr>";
          echo "<td>".$row['fname']."</td>";
          echo "<td>".$row['mname']."</td>";
          echo "<td>".$row['childname']."</td>";
          echo "<td><input type='button' id = 'edit".$row['Id']."' value='Edit'></td>";
          echo "<td><input type='button' id = 'delete".$row['Id']."' value='Delete'></td>";
          echo "</tr>";
      }

If I am using Jquery,how to get the IDof each button?Or If I write a onclick event using javascript for each button and passes the ID's as arguments,can I access via Jquery.Please help me

Answer 1

Add common class name and use that as a selector to get id of the buttons like below

Try like this

$(document).on('click','.edit_btn',function(){
  alert($(this).attr('id'));
});
$(document).on('click','.del_btn',function(){
  alert($(this).attr('id'));
});

HTML

<input type='button' id ='edit' class="edit_btn" value='Edit'>
<input type='button' id ='delete' class="del_btn" value='Delete'>

DEMO