Javascript 从html.append附加的html下拉列表中获取返回值

我试图在对象上的

鼠标悬停

事件上生成一个动态下拉列表。我是这样完成的

  canvas.on('mouse:move', function (e) {

      $('body').append("<div id='imageDialog' style='position: absolute; top: 0; left: 0'><select id='mySelect' onchange='copy();'><option value='wipro' >wipro</option><option value='Hcl' >Hcl</option><option value='krystal kones' >krystal kones</option></select></div>");

  });

但正如预期的那样，它给出了错误

uncaughtreferenceerror:copy未定义

我在这里呆了一段时间，一点运气都没有，我非常感谢你们专家们在这方面的帮助

---

谢谢。

在不使用纯javascript的情况下，像下面的代码一样使用jQuery

$('document').ready(function(){
   $('#imageDialog').on('click',function(){
       alert($('#imageDialog select').value);
   })
})

---

我不确定我是否理解其中的一些设计决策（生成选择框是使用下拉菜单的一种奇怪方式），但我们现在将跳过这一部分，开始讨论好的内容

当您在初始加载后向DOM添加新元素时，您需要以稍微不同的方式考虑事件绑定。由于这些初始元素在您第一次说“嘿，当我悬停在您身上时，所有元素都会这样做”，因此处理它的方式是告诉父元素。卡在jQuery的土地上：

$（'.parent元素'）。在（'click'，'.child元素'，函数（）{}）上

这将提供与将单击直接指定给
.child元素
相同的结果（如果它在初始渲染时存在）。您可以在此处阅读有关委派事件的更多信息：

这里有一把可以帮你清理东西的小提琴：
非常感谢你的建议。我会检查这篇帖子：）非常感谢：）我会检查并发回嗨，答案并不是我预期的。非常感谢你的帮助。扎克·邓恩的回答对我有用：）
$('document').ready(function(){
   $('#imageDialog').on('click',function(){
       alert($('#imageDialog select').value);
   })
})