jQuery单击更改文本（也返回）

Question

我有一个代码可以使用此php动态生成按钮，如果我单击某个按钮，则喜欢更改文本。 问题是仅更改第一个按钮的文本，而不更改其他按钮。怎么了？

    while($row = mysqli_fetch_assoc($result))
    {
        $status = $row['register_status'];
        if ($status == "Active") {
            //$register_status = '<button class="btn btn-success disabled">Enable</button>';
            $register_status = '<button class="btn btn-success" id="btn_status" data-status="Active">Active</button>';
        }
        else {
            //$register_status = '<button class="btn btn-warning disabled">Disable</button>';
            $register_status = '<button class="btn btn-warning" id="btn_status" data-status="Inactive">Inactive</button>';
        }

        $data .= '<tr>
                        <td width="1%"><mark>#'.$row['id'].'</mark></td>
                        <td>'.$row['first_name'].'</td>
                        <td>'.$row['last_name'].'</td>
                        <td>'.$row['email'].'</td>
                        <td width="1%">'.$register_status.'</td>

scripts.js ：

  $('body').click('#btn_status', function(e){
  var button = jQuery('#btn_status');
  if(button.data('status') == 'Active'){
          button.data('status', 'Inactive');
          button.html('Inactive');
        }else if(button.data('status') == 'Inactive'){
          button.data('status', 'Active');
          button.html('Active');
        }
  });

在此屏幕快照中，他们可以看到所有不同的按钮。问题是，仅更改第一个按钮的文本，但需要更改我单击的按钮的文本