JQuery удалить строку таблицы

Question

У меня проблема с удалением строки таблицы, я могу выделить строку красным, но когда я пытаюсь удалить ее, функция сдвига не работает.Я завернул их в div, но я не знаю, как получить доступ к дочерним элементам tr, а затем к дочерним элементам этого?

$('#test tr:not(:first)').click(function()
        {           
            $(this).css("background-color","red");  

            $(this).children("td div").slideUp(function()
            {    
                $(this).parent().remove(); 
            });              
        });

Проблема в следующей строке:

$(this).children("td div").slideUp(function()

Я также пытался

$(this).children("td").children("div").slideUp(function()

Слайд вверх удаляет только первый столбец.

<table border="1" width="600" cellspacing="0" cellpadding="0" id="test">
    <tr>
        <td><b>First Name</b></td>
        <td><b>Last Name</b></td>
        <td><b>Address</b></td>
        <td><b>Town</b></td>

    </tr>

    <tr>
        <td><div>First Name</td>
        <td>Last Name</td>
        <td>Address</td>
        <td>Town</div></td>

    </tr>

</table>

Нужно ли мне оборачивать содержимое каждого <td> тегом div?

Спасибо

Answer 1

Вызов children("td div") найдет всех прямых потомков , соответствующих селектору. (все дети, которые <div> s находятся внутри <td> s)
Поскольку все прямые потомки <td> s, это ничего не будет совпадать.

Вызов children("td").children("div") найдет все <div> с внутри всех <td> с.
Таким образом, он найдет единственное <div>, которое у вас есть.

РЕДАКТИРОВАТЬ : Вы можете использовать jQuery для создания элементов оболочки; см. Мой блог :

$('#test tr:not(:first)').click(function() {           
    $(this).css("background-color","red");  

    $(this).children().wrapInner('<div>').children().slideUp(function() {    
        $(this).closest('tr').remove();
    });
});

Демо