Оценок пока нет Автоматическая прокрутка скролла элемента вниз

Допустим, есть такая задача, при котором в элементе есть некоторый список элементов, которые добавляется по мере необходимости и при этом. при каждом добавлении необходимо, чтобы список автоматически прокручивался вниз. Банальной задачей может быть механизм обмена сообщениями

Код HTML:

<ul id="list">
  <li>Item 1</li>
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
  <li>Item 4</li>
  <li>Item 5</li>
  <li>Item 4</li>
  <li>Item 7</li>
  <li>Item 8</li>
  <li>Item 9</li>
  <li>Item 10</li>
  <li>Item 11</li>
  <li>Item 12</li>
  <li>Item 13</li>
</ul>

Код CSS:

#list {
  height: 100pt;
  overflow-y: scroll;
}

Код JavaScript:

var elem = document.getElementById('list');
elem.scrollTop = elem.scrollHeight;

Ниже пример в песочнице