Javascript 外部依赖项与preventDefault（）冲突？

请为我看一下下面的JavaScript，它打开了一个弹出窗口：

function openPopup(e) {
    e.preventDefault();
    window.open(this.href, "popupWindow", "width=600,height=600,scrollbars=yes");
}
var el = document.querySelector(".bbc-popup");
el.addEventListener("click", openPopup);

下面是一个正在运行的JSFiddle：

但是，当我将其包含在页面中时，代码不起作用，链接将在当前选项卡中打开。我唯一依赖的外部JavaScript资源是jQuery（1.11.3）和bootstrap3，它们都包含在上面的提琴中，没有任何效果

还有什么其他原因导致此代码不起作用

以下是页面的完整

HTML

代码，包括所有外部资源，供您查看它是如何停止工作的。。。应该打开弹出窗口的链接位于查看椅子的构建按钮后面：

在处理完他的评论后，我必须确保将事件侦听器添加到每个元素中，因为我当前的代码只是将其添加到第一个元素中

首先，我将所有我想要作为目标的元素添加到一个数组中

var chairPopup = document.getElementsByClassName("chair-popup");

然后，我循环遍历该数组中的每个元素，将事件侦听器添加到每个元素：

for (var i = 0; i < chairPopup.length; i++) {
    chairPopup[i].addEventListener("click", openPopup);
}

在一个后来被作者删除的答案中，他们提到需要在

window.open（）

函数中将

弹出窗口更改为
\u blank
。我可以确认这是必要的，否则每个链接都会在同一个弹出窗口中打开

window.open(this.href, "_blank", "width=300,height=1000,scrollbars=yes");

你的代码对我来说很好，因为我看到一个新的600x600弹出窗口（W8.1上的Chrome46）。我可以想象，是否允许打开新窗口或在新选项卡中打开新窗口的首选项取决于浏览器中的用户设置。您只需将事件侦听器添加到第一个
.chair popup
元素。退房，太棒了，布莱恩。这似乎现在起作用了：把它放在一个答案里，我很乐意接受。
window.open(this.href, "_blank", "width=300,height=1000,scrollbars=yes");