Element.Style.Propert In Js Broken For What Ever I Try

I am working on a website, but when I try to change the style property through js, it doesn’t work.

I’m using the element.style.property to change the CSS, but whatever I try nothing works.

I Don’t know how to fix this, although it might just be problem with my code editor or compiler

MY JS

  att1Btn.style.background = 'black;'
  att1Btn.style.color = 'white;'
  att2Btn.style.background = 'black;'
  att2Btn.style.color = 'white;'
  att3Btn.style.background = 'black;'
  att3Btn.style.color = 'white;'
  hBtn.style.background = 'black;'
  hBtn.style.color = 'white;'
  eBtn.style.background = 'black;'
  eBtn.style.color = 'white;'
  forfeit.style.background = 'black;'
  forfeit.style.color = 'white;'

MY HTML

    <div class="battle" id="battle" style="position: absolute; left: 0; width: 100%; height: 84%; background: #36afec;">
      <div class="menu">
        <div class="att1" id="att1" onclick="attNum = 1; curPmonFunc()"><br>ATTACK 1</div>
        <div class="att2" id="att2" onclick="attNum = 2; curPmonFunc()"><br>ATTACK 2</div>
        <div class="att3" id="att3" onclick="attNum = 3; curPmonFunc()"><br>ATTACK 3</div>
        <div class="forfeit" id="forfeit" onclick="lose()"><br>FORFEIT</div>
        <div class="health" id="health"></div>
        <div class="energy" id="energy"></div>
      </div>
      <div class="action">
        <div class="pokemon" id="displayP"></div>
        <div class="opponent" id="displayO"></div>
      </div>
    </div>