Каков наилучший способ удалить <br>из <div>, созданного с помощью appendChild?

Question

Я динамически создаю текстовые поля, используя document.createElement ('input') и добавляю разрыв между ними, используя тот же метод, а затем использую .appendChild, чтобы добавить это в мой div.

var box = document.getElementById("myDiv");
var inp = document.createElement('input');
inp.type = 'text';
// add attributes, etc...
box.appendChild(inp);
box.appendChild(document.createElement("br"));

Я могу удалить эти текстовые поля, используя .removeChild, и это нормально, но разрывы все еще есть.

box.removeChild(document.getElementById(...));

Мой вопрос: как мне удалить каждый из разрывов, которые были созданы между каждым из текстовых полей?

Answer 1

var breaks = box.getElementsByTagName('BR');

for (var i = 0; i < breaks.length; i++) {
    box.removeChild(breaks[i]);
}

Answer 2

Должна быть возможность удалить БР, если вы сохраните ссылку на них.

Это должно работать:

var brRef = document.createElement("br");
...    
box.removeChild(brRef);