change css style with javascripts, and If/else statement

For an assigment, we need to build a simple bank atm. 2 of the points are : make sure the balance can't go negative; when the balance of the bank account is $0 the background of that bank account should be red, otherwise green. I commented the part with the css styling cause it won't work even thought my resource for it was http://ift.tt/1qUcqH0 . And why my function checkBalance won't work? I tried different methods, but the only thing that it would do is have my 2 addEventListener stop working at all. MY HTML

    <div class="accounts" id="checkingAccount">
   <h2>Checking Account</h2>

   <h3> Your current balance is </h3>


    <span>$</span> <span id="checkingAmount"> 00.00 </span>

  <p>
   <input id="inputCheckAmount" type="number" placeholder="Enter amount here">
  </p>

  <p>
  <button id="withdrawCheckBtn" type="button">Withdraw</button>
  <button id="depositCheckBtn" type="button">Deposit</button>

 </p>


 </div>

and my JS

var userCheckAmount = document.getElementById('inputCheckAmount');
var withdrawCheckBtn = document.getElementById('withdrawCheckBtn');
var checkSpan = document.getElementById('checkingAmount');
var depositCheckBtn = document.getElementById('depositCheckBtn');


  depositCheckBtn.addEventListener('click', function() {

   var myAmount = Number(userCheckAmount.value);

   var checkingDepositBalance = myAmount + Number(checkSpan.innerHTML);

     checkSpan.innerHTML = checkingDepositBalance;

  });

  withdrawCheckBtn.addEventListener('click', function() {


    var myAmount = Number(userCheckAmount.value);

    var checkingWithdrawBalance = Number(checkSpan.innerHTML) - myAmount;

     checkSpan.innerHTML = checkingWithdrawBalance;

   });

 var checkBalance = function(checkingAmount, withdrawAmount){

    var checkingAmount = Number(checkSpan.innerHTML);
    var withdrawAmount = Number(userCheckAmount.value);

    if(checkingAmount < withdrawAmount) {

     alert ("Impossible proceed! Found insufficent!");

    }
else {

 return true;
     }

  }
// if (Number(checkSpan.innerHTML) === 0) {
 //   document.getElementById('checkingAccount').style.background-color ='red';
   // }

// else if (Number(checkSpan.innerHTML) > 0) {
//   document.getElementById('checkingAccount').style.background-color = 'grey';
// }