Change (Rename) Table header cell value in jQuery

Last Reply one year ago By dharmendr

Posted one year ago

How to change the table header cell value in jquery 

You are viewing reply posted by: dharmendr one year ago.
Posted one year ago

Hi sathya2496,

Check this example. Now please take its reference and correct your code.

HTML

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script type="text/javascript">
        $(function () {
            $('#btnChage').on('click', function () {
                $('#tblCustomers tr').eq(0).find('th').eq(1).html('Contact Name');
            });
        });
    </script>
</head>
<body>
    <table id="tblCustomers" border="1" cellpadding="1" cellspacing="0">
        <tr>
            <th>Id</th>
            <th>Name</th>
            <th>Country</th>
        </tr>
        <tr>
            <td>1</td>
            <td>John Hammond</td>
            <td>United States</td>
        </tr>
        <tr>
            <td>2</td>
            <td>Mudassar Khan</td>
            <td>India</td>
        </tr>
        <tr>
            <td>3</td>
            <td>Suzanne Mathews</td>
            <td>France</td>
        </tr>
        <tr>
            <td>4</td>
            <td>Robert Schidner</td>
            <td>Russia</td>
        </tr>
    </table><br />
    <input id="btnChage" type="button" value="Change Header Text" />
</body>
</html>

Demo