Справочник JavaScript > Объект Element > removeChild() > Метод removeChild() объекта element

Метод removeChild() объекта element

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Название документа</title>
</head>
<body>
 
  <p>Нажмите одну из кнопок, чтобы добавить или удалить последний пункт списка.</p>
 
  <button onclick="bar()">Добавить</button>
  <button onclick="foo()">Удалить</button>
 
  <ul id="list1"><li>Кофе</li><li>Чай</li></ul>
 
  <script>
    var i = 1;
 
    function foo() {
      var elem = document.getElementById("list1").lastChild;
      elem.parentNode.removeChild(elem);
    }
 
    function bar() {
      var elem = document.createElement("li");
      elem.innerHTML = "Water" + i;
      document.getElementById("list1").appendChild(elem);
      i++;
    }
  </script>
 
</body>
</html>

Результат:

Отредактируйте код, указанный выше, и нажмите кнопку "GO" для просмотра результата.