Failed to display/get the value of the table 1st column (userid) in 2nd page pagination in PHP bootstrap

Failed to display/get the value of the table 1st column (userID) in 2nd page pagination in php bootstrap. But its working on the first page of the table

<script type="text/javascript">
  $(document).ready(function(){
    $('.roleViewer').on('click', function(e){
      e.preventDefault();

      $('#roleViewer').modal('show');
      

        $tr = $(this).closest("tr");

        var data = $tr.children('td').map(function(){
          return $(this).text();
        }).get();

        console.log(data);

        $('#viewerID').val(data[0]);  //this value to be pass to pop up modal form to be used for updating record    
    });
  });
</script>