d3 порядок метки и чекбокс

Question

Мой вопрос является бесплатным для этого поста , но, поскольку мне не хватает репутации, я не смог задать его в комментарии!

Я пытался динамически создавать флажки и метки, используя d3.Заставить его работать с ярлыком + легко.Я хотел поставить флажок перед меткой, реплицировав этот HTML-код:

<label><input type="checkbox" id="checkbox1">Option 1</label>

Решение в вышеупомянутом посте работает, но я не понимаю, почему цепочка (вложенный выбор / добавление)версия не работает?(т.е. код ниже)

var temp = item.append("label");

temp.append("input")
    .attr("type", "checkbox")
    .attr("checked", true)
    .attr("id", function (d,i) {
        return "checkbox" + i;
    })
    .on("click", function (d,i) {
        ....
    });
temp.text(function (d) {
        return d.text;
    });

Я ожидаю, что код добавит текст метки после ввода, но это не так.Может кто-нибудь объяснить, почему?Я что-то упустил?