Javascript-模拟单击div元素

Question

我一直在尝试模拟对这些div元素中任何一个的点击。在浏览器中单击它们时，按钮周围的颜色会更改。

在被点击之前：

<div class="MatchModeQuestionGridBoard">
<div class="MatchModeQuestionGridBoard-tiles">
<div class="MatchModeQuestionGridBoard-tile">
<div class="MatchModeQuestionGridTile" touch-action="auto">
<div class="MatchModeQuestionGridTile-content">
<div class="FormattedText notranslate MatchModeQuestionGridTile-text lang-es" style="font-size: 12px;">
<div style="display: block;">ocho</div></div></div></div></div>

点击后

<div class="MatchModeQuestionGridBoard">
<div class="MatchModeQuestionGridBoard-tiles">
<div class="MatchModeQuestionGridBoard-tile">
<div class="MatchModeQuestionGridTile is-selected" touch-action="auto">
<div class="MatchModeQuestionGridTile-content">
<div class="FormattedText notranslate MatchModeQuestionGridTile-text lang-es" style="font-size: 12px;">
<div style="display: block;">ocho</div></div></div></div></div>

我尝试过的其他事情：

var clickEvent = document.createEvent('MouseEvents');
clickEvent.initEvent("click", true, true);
document.getElementsByClassName("MatchModeQuestionGridTile-content")[0].dispatchEvent(clickEvent);

我尝试使用javascript扩展Chrome，以实现模拟点击。我已经尝试过document.getElementsByClassName("MatchModeQuestionGridTile-content")[0].click()， 和

在完整的html中，MatchModeQuestionGridTile-content的类成员更多，这就是为什么我有[0]的原因。