Проблема с вновь созданным списком - кнопки перемещения вверх, вниз, добавления событий не работают jQuery

Question

Невозможно выполнить какое-либо событие для вновь созданного списка. Кнопки двигаться вверх, двигаться вниз, добавлять события не работают.

, пожалуйста, следуйте по ссылке пера кода [ссылка] (https://codepen.io/graphics_anup/pen/jOORjGK)

    var itemList = document.getElementById('itemList');


$(".up").click(function(){
  var $current = $(this).closest('li')
  var $previous = $current.prev('li');
  if($previous.length !== 0){
    $current.insertBefore($previous);
    var temp = $previous[0].children[0].innerText;
    $previous[0].children[0].innerText = $current[0].children[0].innerText;
    $current[0].children[0].innerText = temp;
  }
  return false;
});

$(".down").click(function(){
  var $current = $(this).closest('li')
  var $next = $current.next('li');
  if($next.length !== 0){
    $current.insertAfter($next);
    var temp = $next[0].children[0].innerText;
    $next[0].children[0].innerText = $current[0].children[0].innerText;
    $current[0].children[0].innerText = temp;
  }
  return false;
});

// update numbers count
function updateNumberCount(from){
  var serialNum = $('li .slno');
  for(var i=from-1; i < serialNum.length; i++){
     serialNum[i].innerHTML = i+1;
  }
} 

$(".addRow").click(function(){
  var $current = $(this).closest('li');
  $(`<li><span class="slno">99</span>  Item 99 <button class="delete">X</button><button class="addRow">+</button><button class="down">&darr;</button><button class="up">&uarr;</button></li>`).insertAfter($current);
});