Вставка столбца таблицы с помощью jQuery

Question

У меня есть таблица данных, к которой мне нужно динамически добавить столбец. Допустим, у меня есть базовая таблица для начала:

<table>
 <tr><td>cell 1</td><td>cell 2</td><td>cell 3</td></tr>
 <tr><td>cell 1</td><td>cell 2</td><td>cell 3</td></tr>
 <tr><td>cell 1</td><td>cell 2</td><td>cell 3</td></tr>
</table>

Я хотел бы вставить столбец между ячейкой 1 и ячейкой 2 в каждой строке ... Я пробовал это, но это просто не работает, как я ожидаю ...

$(document).ready(function(){
 $('table').find('tr').each(function(){
  $(this).prepend('<td>cell 1a</td>');
 })
})

Answer 1

Попробуйте это:

$(document).ready(function(){
    $('table').find('tr').each(function(){
        $(this).find('td').eq(0).after('<td>cell 1a</td>');
    });
});

Ваш исходный код будет добавлять столбец в конец каждой строки, а не между столбцами. Это находит первый столбец и добавляет ячейку рядом с первым столбцом.

Answer 2

$('table > tr > td:first-child').after( '<td>cell 1a</td>' );

tr > td выбирает первый уровень td после tr, а after вставляет данные вне элемента.

Answer 3

$('td:first-child').after('<td>new cell</td>');