CODEWITHSUNDEEP
javascriptjqueryhtml
t1w
t1w

Reputation: 1428

jQuery is removing wrong table column

I've been trying to remove 1st column of my html table by referencing this site: Link.

But when i clicked on it, 2nd column of my table get removed. And on second click, 3rd column gets removed. And on further clicks, nothing happens. Below you can check my html and javascript, it's plain simple but i'm really confused about the result.

<html>
    <head>
        <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
        <script>

            function deleteFirstColumn(){
                //$('table tr').find('td:eq(1),th:eq(1)').remove();

                //remove the 1st column
                $('table tr').find('td:eq(1),th:eq(1)').remove();

                //remove the 2nd column
                //$('table tr').find('td:eq(1),th:eq(1)').remove();
            }
        </script>

    </head>

    <body>

        <button type="button" onclick="deleteFirstColumn()"> delete first column</button>

        <table border="1">
            <tr>
                <td>column 1</td>
                <td>column 2</td>
                <td>column 3</td>
            </tr>

            <tr>
                <td>c 1</td>
                <td>c 2</td>
                <td>c 3</td>
            </tr>

            <tr>
                <td>c 1</td>
                <td>c 2</td>
                <td>c 3</td>
            </tr>
        </table>
    </body>
</html>

Upvotes: 0

Views: 110

Answers (2)

Rajaprabhu Aravindasamy
Rajaprabhu Aravindasamy

Reputation: 67207

.eq() works with zero based index. In other words, the lower bound that we consider while using that function is zero,

Try,

 $('table tr').find('td:eq(0),th:eq(0)').remove();

Upvotes: 1

VisioN
VisioN

Reputation: 145398

Which is correct, since indices in JavaScript start with 0:

$('table tr').find('td:eq(0),th:eq(0)').remove();  // remove 1st column

After each click your jQuery selector finds the first column from what is left in the table, so after 3 clicks you will remove all columns from the table.

Upvotes: 1

Related Questions