выберите дочерних элементов div определенного типа

Question

Я хочу выбрать всех "входных" детей из "div" -детей моего "mainDiv". Я попробовал это с 'div input: first-child', как вы можете видеть ниже, и как я нашел это на http://api.jquery.com/first-child-selector/. Но это не работает. Если я использую только div в качестве фильтра, он работает нормально. Так в чем моя ошибка? Или как добраться до всех «входных» детей простым способом?

        var data = ['name1', 'name2'];
        var mainDiv = $('<div>');
        for (var i = 0; i < data.length; i++)
        {
            var div = $('<div>').appendTo(mainDiv);
            $('<input type="checkbox">').appendTo(div);
            div.append(' ' + data[i]);
        }
        mainDiv.children('div input:first-child').each(
            function()
            {
                var child = $(this);
                alert('xx');
            });

Answer 1

Предполагая, что я правильно понял ваш вопрос, вы пытаетесь получить все элементы input, которые являются потомками div:

mainDiv.find("div > input");

Если вы хотите все потомки input элементов, а не только прямые потомки:

mainDiv.find("div input");

Обратите внимание, что вам нужно использовать find, а не children. Метод children просматривает только прямые дочерние элементы и возвращает их, если они соответствуют селектору. Селектор div input не будет соответствовать ни одному из прямых потомков (единственный прямой потомок - div), поэтому элементы не возвращаются.

Answer 2

Ну, на самом деле вы создаете div с

 var mainDiv = $('<div>');

, затем добавляете <div> к нему

 var div = $('<div>').appendTo(mainDiv);

Затем добавляете <input> к <div>

 $('<input type="checkbox">').appendTo(div);

Таким образом, входные данные не являются прямыми потомками mainDiv, они являются потомками, поэтому вы должны сделать

 mainDiv.find('input').each