当javascript动态创建ul＆gt; li时，jquery自动宽度函数不起作用

Question

我是stackoverflow的新手，这是我的第一个问题。如果我犯了任何错误，请忽略。 这是我的问题：首先我创建jquery来定义要列出的自动宽度。

(function(){
        var items = $('.main-menu>li');
        var maxitems = items.length; //items.length;
        var current = items[0];
        $('.main-menu li').css('width', (100 / maxitems | 0) + '%');
})();

然后我编写这些代码来动态创建li元素。但不幸的是，这些新创建的li项目没有采用我之前编码的自动宽度功能。

function topMenu() {
  document.getElementById('addTopMenu').onclick = addTopMenu;
}

function addTopMenu() {
  var el = document.getElementById("main-menubar");
  var node = document.createElement("li");
  node.id = "main-menubar";
  var link = document.createElement("a");
  link.innerText = data = prompt("Type A Name For New Menu","");
  var value = prompt("Type The href Of The Menu","");
  link.setAttribute("href", value);
  node.appendChild(link);
  el.appendChild(node);
}

请帮我解决这个问题。提前谢谢。