Question

I want to display the header column text of a table(present within anchor) and bind alert event to anchor. I have tried something but it’s not working

   <table style="width:20%;border:1;border-style:solid"   >
        <tr>
            <td>
               <a href="#">Header 1</a> </td>
            <td>
                <a href="#">Header 2</a></td>
            <td>
               <a href="#">Header 3</a></td>
        </tr>
        <tr>
            <td>
                R1C1</td>
            <td>
                R1C2</td>
            <td>
                R1C3</td>
        </tr>
        <tr>
            <td>
                R2C1</td>
            <td>
                R2C2</td>
            <td>
                R2C3</td>
        </tr>
    </table>

Please find the jquery used

  <script type="text/javascript">

        $(document).ready(function () {
            //should display Header 1, Header 2, Header 3
            $("table tr td a").each(alert($(this).text()));
            //Add click event for anchor
            $("table tr td a").click(function (e) { alert(); })
        });

    </script>

Answer 1

    $(document).ready(function () {
        //should display Header 1, Heder 2, Header 3
        $("table tr td a").each(function() {// need a function here
            alert($(this).text())
         });
        //Add click event for anchor
        $("table tr td a").click(function (e) { alert($(this).text()); return false;})
    });