不能删除刚刚创建的元素，js函数不起作用

Question

当我尝试向页面添加元素然后将其删除时，代码不会向我显示任何错误，也不会删除项目...困惑。这是功能：

var counter = 1;
var limit = 10000;
var counterTextArea = 0;

    function addInput(divName){
         if (counter == limit)  {
              alert("You have reached the limit of adding " + counter + " inputs");
         }
         else {
              var newdiv = document.createElement('div');
              //newdiv.innerHTML = "Card" + (counter + 1) + " <br><input type='text' name='myInputs[]'>";
              newdiv.innerHTML = " <div id = '1'><li class='ui-state-default'><textarea id='1' name='1' style='overflow: auto;resize: none; resize:vertical;' placeholder = 'Type here ..' spellcheck='true' rows='3' cols='18' tabindex='4'></textarea><div class='btn-group'><button type='button' class='btn btn-default btn-xs dropdown-toggle' data-toggle='dropdown'>Action <span class='caret'></span></button><ul class='dropdown-menu' role='menu'><li><a class='del' href='#' data-id='1'>Delete</a></li><li><a class='lok' href='#' data-id='1'>Lock</a></li><li><a class='edt' href='#' data-id='1'>Edit</a></li><li class='divider'></li><li><a href='#'>Share</a></li></ul></div></li></div> ";
              counterTextArea++;
              document.getElementById(divName).appendChild(newdiv);
              counter++;
         }
    }

P.S。这是删除元素的功能：

$(function(){
$('.del').click(function() {
    var id = parseInt(this.id);
    var mid = id + 'd'
    alert(mid);
    removeDummy(mid);
    return false;
});
});

$(function(){

  $('.del').click(function() {
    var id = parseInt($this.data('id'),10);
    alert(id);
    removeDummy(id);
    return false;
  });
});