动态添加的a元素绑定addEventListener无效问题求助

你的问题出在事件委托的目标判断逻辑上：当点击<a>内部的<div>时，event.target指向的是这个div元素，而非外层的<a>，所以原代码里的if (target.className !== 'link-block-2') return会直接终止执行，导致选中样式无法添加。

不需要调整z-index，直接修改事件监听逻辑即可。用Element.closest()方法能快速找到点击元素所属的外层<a>标签，不管点击的是a本身还是它的子元素：

const buttonscontainer = document.getElementById('div-container-other-projects')
buttonscontainer.addEventListener('click', event => {
  // 找到最近的拥有link-block-2类的父元素
  const targetBtn = event.target.closest('.link-block-2');
  // 如果找不到符合条件的元素，直接返回
  if (!targetBtn) return;
  // 移除所有子元素的选中样式
  Array.from(buttonscontainer.children).forEach(child =>
    child.classList.remove('link-block-2--selected'));
  // 给目标按钮添加选中样式
  targetBtn.classList.add('link-block-2--selected');
})

另外提个小问题：你生成的DOM里，<a>和内部的<div>用了相同的id（比如p1_btn），这不符合HTML规范——同一页面内id必须唯一，建议给div的id加个后缀（比如p1_img），避免潜在的DOM操作冲突。

内容的提问来源于stack exchange，提问作者Albert Badias