Make text of row column bold and unbold on button click

Question

I'm trying to unbold text of a row on button click just like gmail messages. For that i'm using jquery to perform that action. On a particular row, when the button is clicked the text of that row would get unbold and the button would be disabled.

Below is what I've done.

.cshtml

<table class="table table-bordered table-responsive table-hover" style="font-weight: 700;">
        @for (int i = 0; i<ViewBag.notifications.Count;i+=2)
        {
            <tr>
                <td>
                    @ViewBag.notifications[i]
                </td>

                <td>
                    @ViewBag.notifications[i + 1]
                </td>

                <td>
                    <input type="button" class="readmessages" value="asdasd" data-toggle="toggle" />
                </td>

            </tr>
        }   
        </table>

<script>
$(".readmessages").click(function () {
            var $row = $(this).parents('tr');
            var text = $row.find('td:nth-child(2)').text();

        });
</script>