jQuery fügt eine HTML-Tabellenspalte hinzu

Ich habe eine HTML-Tabelle wie diese:

<table border="1">
    <tbody>
        <tr>
            <td><a href="#" class="delete">DELETE ROW</a>COL 1</td>
            <td><a href="#" class="delete">DELETE COL</a>COL 2</td>
            <td><a href="#" class="delete">DELETE COL</a>COL 3</td>
            <td><a href="#" class="delete">DELETE COL</a>COL 4</td>
            <td><a href="#" class="delete">DELETE COL</a>COL 5</td>
            <td><a href="#" class="delete">DELETE COL</a>COL 6</td>
        </tr>
        <tr>
            <td>ROW 1</td>
            <td>ROW 1</td>
            <td>ROW 1</td>
            <td>ROW 1</td>
            <td>ROW 1</td>
            <td>ROW 1</td>
        </tr>
        <tr>
            <td>ROW 2</td>
            <td>ROW 2</td>
            <td>ROW 2</td>
            <td>ROW 2</td>
            <td>ROW 2</td>
            <td>ROW 2</td>
        </tr>
    </tbody>
</table>

Was ich brauche, ist eine Funktion, um eine neue Spalte mit einer Anzahl von td basierend auf anderen Spalten hinzuzufügen. Die Sache ist, dass in dieser HTML-Tabelle Spalten mit jQuery entfernt werden, bevor neue Spalten hinzugefügt werden, sodass die Funktion die aktuelle Spaltenkonfiguration abrufen und entsprechend anpassen muss, da die Zeilen und Spalten immer entfernt oder hinzugefügt werden.

Ich habe diesen Code zum Hinzufügen einer neuen Spalte, aber der Header wird nicht hinzugefügt:

function addACol() {
    var currentNumberOfTDsInARow = $('.tblModel tr:first td').length;
    newColNum = currentNumberOfTDsInARow;
    var rows = $('.tblModel tbody tr');
    for (var i = 0; i < rows.length; i++) {
        var lastTDClone = $(rows[i]).find('td:last').clone();
        $(rows[i]).find('td:last').after(lastTDClone);
    }
}

Antworten auf die Frage(2)

Ihre Antwort auf die Frage