[jQuery] Getting data from the corresponding column. (HTML Table with thead and tbody section.)

[jQuery] Getting data from the corresponding column. (HTML Table with thead and tbody section.)


In this code, I would like to edit the function to get not only the
value of the item clicked, I would also like to get information from
the thead section for the corresponding column. For example when I
click on tBody-1B I would like it to get the value of tHead-1B or if I
click on tBody-3C I would like to to also get the value of tHead-1C.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head>
        <title>WLVAC Cadets Member List</title>
        <style>
            table, thead, tbody, tfoot, tr, th, td {
                border-collapse: collapse;
                border: 1px SOLID;
                padding: 10px 10px 10px 10px;
            }
        </style>
        <script src="http://jqueryjs.googlecode.com/files/
jquery-1.3.1.min.js" type="text/javascript"></script>
        <script type="text/javascript">
            $(function() {
                $('tbody td').click(function(e) {
                    var innerHTML = $(this).get(0).innerHTML;
                    alert(innerHTML);
                })
            });
        </script>
    </head>
    <body>
        <table>
            <thead>
                <tr>
                    <th>tHead-1A</th>
                    <td>tHead-1B</td>
                    <td>tHead-1C</td>
                    <td>tHead-1D</td>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <th>tBody-1A</th>
                    <td>tBody-1B</td>
                    <td>tBody-1C</td>
                    <td>tBody-1D</td>
                </tr>
                <tr>
                    <th>tBody-2A</th>
                    <td>tBody-2B</td>
                    <td>tBody-2C</td>
                    <td>tBody-2D</td>
                </tr>
                <tr>
                    <th>tBody-3A</th>
                    <td>tBody-3B</td>
                    <td>tBody-3C</td>
                    <td>tBody-3D</td>
                </tr>
                <tr>
                    <th>tBody-4A</th>
                    <td>tBody-4B</td>
                    <td>tBody-4C</td>
                    <td>tBody-4D</td>
                </tr>
            </tbody>
        </table>
    </body>
</html>