title: remove a child element br
body: <p>I am working on a dynamic Checkbox where I can add and remove e.g. users. The adding is working fine, but to remove all the child elements troubles. Especially the br I don't know how to remove.</p>
  
  <pre><code>        &lt;style&gt;
      .container { align:right; border:1px solid #000000; width:300px; height: 100px; overflow-y: scroll;}
      &lt;/style&gt;
      &lt;script type="text/javascript"&gt;
      var addTask = function () {
  
        var newCheckbox = document.createElement("input");
        newCheckbox.type = "checkbox";
        newCheckbox.value = document.getElementById("MailAddress").value;
      newCheckbox.id = "C11";
        document.getElementById("UserList").appendChild(newCheckbox);
  
  
        var label = document.createElement('label');
        label.htmlFor = document.getElementById("MailAddress").value;
      label.id = "L11";
        label.appendChild(document.createTextNode(document.getElementById("MailAddress").value));
  
        document.getElementById("UserList").appendChild(label);
        document.getElementById("L11").appendChild(document.createElement("br"));
    }
  
    function delTask() {
  
          var item = document.getElementById("C11");
          item.parentNode.removeChild(item);
          var item = document.getElementById("L11");
          item.parentNode.removeChild(item);
        // How can I remove die &lt;br&gt; too?
    }
    &lt;/script&gt;
      &lt;/head&gt;
      &lt;body&gt;
  
  
      &lt;header&gt;
          &lt;p&gt;Usergroup:&lt;/p&gt;
      &lt;/header&gt;
      &lt;input type="text" id="MailAddress"&gt;
      &lt;input type="submit" value="Add Mail Address" onClick="addTask()" id="AddUser"&gt;
  
      &lt;div  class="container" id="UserList"&gt;&lt;/div&gt;
  
      &lt;input type="submit" value="Delete One Mail" onClick="delTask()" id="remove"&gt;
  </code></pre>