为什么用十六进制颜色代码编码的颜色在单击事件后不会改变其颜色？

如何解决为什么用十六进制颜色代码编码的颜色在单击事件后不会改变其颜色？

我尝试使用下面的代码更改正文中标题的颜色。

const title = document.getElementById("title");

const BASE_COLOR = "#7f8c8d"; // This did NOT work.
const OTHER_COLOR = "rgb(52,73,94)";

function handleClick() {
    const currentColor = title.style.color;
    console.log(currentColor);
    if (currentColor === BASE_COLOR) {
        title.style.color = OTHER_COLOR;
    }
    else {
        title.style.color = BASE_COLOR;
    };
}

function init() {
    title.style.color = BASE_COLOR;
    title.addEventListener("click",handleClick)
}

init()

但是当我点击标题时，颜色没有改变。

然而，我发现当我改变颜色代码的顺序，并将BASE_COLOR改为rgb代码时，它工作得很好。

const BASE_COLOR = "rgb(52,94)"; // This worked!
const OTHER_COLOR = "#7f8c8d";

我能不能弄明白为什么它会这样工作。 我猜测是因为十六进制颜色代码前面的主题标签，但我不确定。 有人能解释一下是什么原因吗？