Javascript 两个事件处理程序相互单击，没有无休止的循环？

这里的新用户，尝试学习一些我认为很基本的东西。但我遇到了这样一个场景，我想从已经准备好的数组中填充一个google地图标记列表

所以我想做的是放大地图上的标记，并高亮显示列表中相应的元素。让map marker和list元素都可以单击，并执行相同的操作。互相点击。没有它们永远循环

在本例中，我为每个执行实际工作的处理程序运行独立的函数。这是正确的方法。但这让我想到我对逻辑运算符的理解有多差

我没有在这里输入所有代码，而是将其简化为以下基本内容，并创建了一个代码笔来说明：

下面是代码：

Html:

按钮1
按钮2

项目1

Javascript:

$(document).on('click', '#button1', function(e) {
    console.log('clicked button 1');
    $(this).css('color', 'red');

    $('#button2').trigger('click');
    populateList('button1');

});

$(document).on('click', '#button2', function(e) {
    console.log('clicked button 2');
    $(this).css('color', 'button');

    $('#button1').trigger('click');
    populateList('button2');

});

function populateList (button) {
    var list = $_('#list');
    list.append('<li>New item from: ' + button + '</li>')
}

$（文档）。在（'click'，'#button1'，函数（e）{
log（“单击按钮1”）；
$（this.css（'color'，'red'）；
$（'#按钮2'）。触发器（'click'）；
大众主义者（“按钮1”）；
});
$（文档）。在（'单击'，'按钮2'，函数（e）{
log（“单击按钮2”）；
$（this.css（'color'，'button'）；
$（'#button1'）。触发器（'click'）；
大众列表（“按钮2”）；
});
函数populateList（按钮）{
变量列表=$('列表'）；
list.append（“
新项来自：”+按钮+“
”）
}

我知道我可以通过为每个单击处理程序创建变量来解决这个问题，并相应地将其设置为true或false。但正是这种逻辑让我感到困惑。什么时候设置为true，什么时候设置为false

---

编辑：我也知道我应该在点击处理程序中运行函数，让两个点击处理程序运行相同的函数，而不是互相触发。但我想这只是对逻辑运算符的基本理解。我只需要学习这个，不管这个例子多么愚蠢。因为我将来可能会遇到类似的情况。这些东西总是让我感到不舒服

你到底为什么想让每个按钮点击另一个按钮？你应该有两个按钮点击调用一个独立的函数，或者只有列表项点击调用标记点击（反之亦然）。是的，我刚刚用这个更新了我的问题。：）我知道我永远不应该这样做，但我想学习的是基本的逻辑运算符，而不是这个确切的场景。谷歌地图的情况就是这样解决的。两个单击处理程序运行相同的独立函数。

$(document).on('click', '#button1', function(e) {
    console.log('clicked button 1');
    $(this).css('color', 'red');

    $('#button2').trigger('click');
    populateList('button1');

});

$(document).on('click', '#button2', function(e) {
    console.log('clicked button 2');
    $(this).css('color', 'button');

    $('#button1').trigger('click');
    populateList('button2');

});

function populateList (button) {
    var list = $_('#list');
    list.append('<li>New item from: ' + button + '</li>')
}