javascript - カラーピッカーを使用してwordpressウィジェットエリアのテキスト、背景色を変更する

Question

私の Wordpress ブログでは、入力フィールドとして 3 つのカラー ピッカーを持つウィジェットを作成しました。ウィジェットのユーザーがテキストの色、背景、ボタンの色をカスタマイズできるようにするためのそれぞれ。問題は、実用的な解決策を思い付くことができなかったことです。これが私が試したことです：

<script type="text/javascript">
    document.getElementById("wid-small-div").style.color = <?php echo '"#' . $instance['text-color'] . '"';?>;
    document.getElementById("wid-small-div").style.background = <?php echo '"#' . $instance['bg-color'] . '"';?>;
</script>

このスクリプトは、ウィジェット クラスの widget($args, $instance) 関数に記述されています。

また、ショートコードの div のみを変更して同じ場所でこの JavaScript を使用すると、ショートコードで機能します。ウィジェットで機能しないのはなぜですか?

ウィジェットの div id は「wid-small-div」です。

解決策は何ですか？ありがとうございました。