HTMLのカラーコード等は理解できる前提で進めます(カラーコード一覧はこの辺りを参照して下さい )。何通りか設定方法があります。
①JavaScriptで作成したボタンのstyle属性にアクセスして色を設定
const myIndexButton = document.createElement('button');
myIndexButton.style.backgroundColor = '背景色';
myIndexButton.style.color = '文字色';
myIndexButton.style.borderColor = '罫線色';
こんな形で設定できます(スタイルをキャメルケースで記述することになりますが、この辺りの理解はある程度使えるようになってからで問題ありません)。色以外の設定もできます(一覧はこちら )。
②CSSで設定
const myIndexButton = document.createElement('button');
myIndexButton.className = 'my-index-button';
.my-index-button {
background-color: '背景色';
color: '文字色';
border-color: '罫線色';
}
このような形で設定します。JavaScriptでボタンにクラス名を与え、CSSでクラス名に対して装飾を指定します。JavaScriptで書く場合と違って、同じクラス名のものを複数使い同じスタイルにする場合、総合的に記述量が減ります(対して①の方法では、同じスタイルにする場合都度記述する必要があります)。
他にも方法はありますが、ひとまず①の方法を覚えて、②の方が有用な場面等が出てきたら、という認識で良いと思います。