根据每个表格行中的单元格值更改按钮文本 - Jquery

Question

I have a HTML table that is showing data from DB. A [status] column shows the status of each record as "AVAILABLE", "BOOKED" or "ON-HOLD". the last column of table is [ACTION] column which contains a BUTTON. If the status of row = "Available" then button text should be "BOOK". Likewise if the status = "BOOKED" or "ON-HOLD" the the button text should be "VIEW". I have applied css successfully via jquery that changes the background-color of status column based on the text in the cell as mentioned above but the same code is not working for button text.

HTML

<tr id="data_row">       
   <td class="align-middle text-center"><?php echo $Project; ?></td>
   <td class="align-middle text-center"><?php echo $Sector; ?></td>
   <td class="align-middle text-center"><?php echo $Category ;?></td>
   <td class="align-middle text-center"><?php echo $Plot_title ;?></td>
   <td class="align-middle text-center"><?php echo $App_date ;?></td>
   <td class="align-middle text-center"><?php echo $Customer ;?></td>
   <td class="align-middle text-center" id= "status"><?php echo $Status ;?></td>
   <td class="align-middle text-center">
       <button type="button" name="edit" id="<?php echo $Plot_ID; ?>" class="btn btn-outline-primary btn-sm edit_data" data-toggle="modal" data-target="#modalform" data-backdrop="static" data-keyboard="false">Book</button>
   </td>
</tr>   

Jquery

$('#myTable tr#data_row td#status').each(function () {
    switch ($(this).text()) {

        case "Booked":
            $(this).css({"background-color":"#eeac88", "color":" #7a3b2e"}); // (WORKING FOR CSS)
            $(".edit_data").text("View"); // (NOT WORKING FOR TEXT CHANGE)
            break;

        case "on-Hold":
            $(this).css("background-color","#fefbd8");
            $(".edit_data").text("View");
            break;
    
        default:
            $(this).css({"background-color": "#c5d5c5", "color":"green"});
            $(".edit_data").text("Book");
            break;
    }
});

Answer 1

Try

$(".edit_data").hmtl("View");

Or put a <span> inside the button to access it with.text() method