Как удалить первый дочерний элемент, на который ссылается $ (this) в Jquery?

Question

Сценарий таков: у меня есть два div s: один, где я выбираю предметы (divResults), и он переходит к следующему div (divSelectedContacts) Когда я выбираю его, я ставлю галочку рядом с ним. То, что я хочу сделать, это когда я выбираю его снова, я хочу удалить галочку, а также удалить элемент из divSelectedContacts.

Вот код:

$("#divResults li").click(function()
{
    if ($(this).find('span').size() == 1)
    {
        var copyElement = $(this).children().clone();
        $(this).children().prepend("<span class='ui-icon ui-icon-check checked' style='float:left'></span>");
        $("#divSelectedContacts").append(copyElement);
    } else
    {
        var deleteElement = $(this).find('span'); //here is the problem how to find the first span and delete it
        $(deleteElement).remove();
        var copyElement = $(this).children().clone();//get the child element
        $("#divSelectedContacts").find(copyElement).remove(); //remove that element by finding it
    }
});

Я не знаю, как выбрать первый span в li, используя $(this). Любая помощь очень ценится.

Answer 1

Несколько способов:

$(this).find('span:first');

$(this).find(':first-child');

$(this).find('span').eq(0);

Обратите внимание, что вам не нужно использовать $(deleteElement), поскольку deleteElement уже является объектом jQuery. Таким образом, вы можете сделать это так:

$(this).find('span:first').remove();

Answer 2

или вы можете просто бросить все это в селектор ...

$('span:first', this);

Answer 3

Чтобы получить первого ребенка из $(this), используйте это:

$(this).find(":first-child");