knockout.js afterRender在jquery弹出窗口中不起作用

<!-- 在弹出窗口中定义模板 -->
<script type="text/html" id="popup-template">
  <div data-bind="template: { name: 'my-template', afterRender: myAfterRender }"></div>
</script>

<!-- 在主页面中定义模板 -->
<script type="text/html" id="my-template">
  <!-- 模板内容 -->
</script>

<!-- 在主页面中使用弹出窗口 -->
<button data-bind="click: openPopup">打开弹出窗口</button>

<script>
  var viewModel = {
    openPopup: function() {
      // 创建弹出窗口
      var popup = $('<div>').appendTo('body');
      
      // 将模板应用于弹出窗口
      ko.renderTemplate('popup-template', viewModel, {}, popup.get(0));
    },
    myAfterRender: function(elements) {
      // 在元素渲染后执行自定义逻辑
    }
  };

  ko.applyBindings(viewModel);
</script>