Javascript JQuery将调色板颜色应用于html页面中的任何内容

我有一个div包含3种颜色，这是我的调色板，我想通过点击这个div来改变按钮、文本、图标等的颜色

这是html代码：

<div class="colorPalet left">
    <div id="colorsPal">
        <div class=" left colorZone" style="background-color:#703d57;"></div>               
        <div class=" left colorZone" style="background-color:#b37ba4;"></div>
        <div class="left colorZone" style="background-color:#d9b8c4;"></div>
    </div>
</div>

这是我的调色板：

将此添加到上述js中：

body.style.setProperty("--color", color);

---

您将如何选择哪些按钮、链接、图标等。。。您想更改的颜色？我将根据ID或类名选择它们使用“css变量”、“元素.onclick”和“元素.style”。因此，您想从单击的“colorPalet”元素中获取每种颜色，然后使用它们为其他元素着色？是的，完全是@eskimo

<div onclick="colorize(this)"></div>

body {
  --color:#fff;
}

.allcoloredelements {
  background-color:var(--color);
}

body.style.setProperty("--color", color);