尝试使用document.queryselector将事件侦听器添加到onclick事件

Question

我一直在尝试为onclick事件添加一个非常简单的事件侦听器，以测试其他无法正常工作的事件。由于我是编程新手，所以我决定创建一个随机div，其中包含一些文本，以便练习记录onclick事件。这是我的html文档的示例（是格式正确的更大文档的一部分）：

 <main>
                <div class = "test"> Hello </div>

我的js像这样：

var testing = document.querySelector(".test");

testing.addEventListener("click", function(){
    console.log("Test");
});

但是，这不起作用。我以为，也许我需要使div框更大以便于单击（实际上只是尝试任何操作），所以这就是我在样式表中所做的：

.test{
    height: 100px;
    width:100px;
}

我真的不确定发生了什么，因为我以前尝试过创建简单的事件侦听器并且没有任何问题...