在网页开发中，我们常常需要生成多个元素并对它们绑定事件。在这种情况下，使用jQuery可以非常方便地实现这个功能。

$('body').on('click', 'button', function() {
  alert('Hello World!');
});

for (var i = 0; i < 10; i++) {
  var btn = <button>点击我</button>;
  $('body').append(btn);
}

上面的代码中，我们使用了jQuery的on方法来绑定按钮的click事件。on方法接受三个参数：事件类型、要绑定事件的元素、事件处理函数。其中，第二个参数可以是任何jQuery选择器，包括动态生成的元素。

接下来，使用for循环来生成10个按钮，并将它们添加到body元素中。由于这些按钮是动态生成的，我们无法直接使用$('button')选择器来绑定它们的事件。因此，我们将事件绑定到body元素上，并指定按钮为该事件的目标元素。

$('body').on('click', 'button', function() {
  var index = $(this).index() + 1;
  alert('你点击了第' + index + '个按钮！');
});

for (var i = 0; i < 10; i++) {
  var btn = <button>点击我</button>;
  $('body').append(btn);
}

上面的代码中，我们修改了事件处理函数，使它可以显示点击的按钮序号。通过调用$(this)获取当前点击的按钮对象，并使用index()方法获取它在同级元素中的序号。需要注意的是，index()方法的序号从0开始计数，因此我们需要将其加1。

在实际开发中，我们可以根据需要自由地生成多个元素并对它们绑定各种事件。这种方法具有较高的灵活性和效率，值得我们加以掌握。