Не меняется значение textContent при нажатии на кнопку, при этом значение для textContent беру из input

HTML:

    <div class="wrapper">
        <main class="page">
            <div class="page__container">
                <section class="tracker">
                    <section class="tracker__top top-tracker">
                        <div class="top-tracker__balance">Баланс: <span id="balance" class="top-tracker__sum">0<span></span><small>₽</small></div>
                        <select name="form[]" class="top-tracker__select">
                            <option value="1" selected>Всё время</option>
                            <option value="2">Сентябрь</option>
                            <option value="3">Октябрь</option>
                            <option value="4">Ноябрь</option>
                        </select>
                    </section>
                    <section class="tracker__content content-tracker">
                        <div class="content-tracker__item content-tracker__item--income">
                            <h4 class="content-tracker__heading">Доходы</h4>
                            <div class="content-tracker__sum"><span id="incomeAmount" class="content-tracker__number">0</span><small>₽</small></div>
                            <form action="" class="content-tracker__form form-content-tracker">
                                <input id="incomeName" autocomplete="off" type="text" placeholder="Введите название дохода" class="form-content-tracker__input form-content-tracker__input--name">
                                <input min="0" id="incomeSum" autocomplete="off" type="number" placeholder="Введите сумму дохода" class="form-content-tracker__input form-content-tracker__input--sum">
                                <button disabled id="incomeButton" type="button" class="form-content-tracker__button">Добавить</button>
                            </form>
                            <div id="incomes" class="content-tracker__inner">
                            </div>
                        </div>
                        <div class="content-tracker__item  content-tracker__item--expense">
                            <h4 class="content-tracker__heading">Расходы</h4>
                            <p id="expenseAmount" class="content-tracker__sum">0<small>₽</small></p>
                            <form action="" class="content-tracker__form form-content-tracker">
                                <input id="expenseName" autocomplete="off" type="text" placeholder="Введите название расхода" class="form-content-tracker__input form-content-tracker__input--name">
                                <input min="0" id="expenseSum" autocomplete="off" type="number" placeholder="Введите сумму расхода" class="form-content-tracker__input form-content-tracker__input--sum">
                                <button disabled id="expenseButton" type="button" class="form-content-tracker__button">Добавить</button>
                            </form>
                            <div id="expenses" class="content-tracker__inner">
                            </div>
                        </div>
                    </section>
                </section>
            </div>
        </main>
    </div>
    @@include('html/_popup.htm',{})
    @@include('html/_js.htm',{})
</body>

JS:

let balance = document.querySelector("#balance").textContent;
const incomesList = document.querySelector("#incomes");
const incomeButton = document.querySelector("#incomeButton");
let incomeAmount = Number(document.querySelector(".content-tracker__number").textContent);
const incomeInputName = document.querySelector("#incomeName");
const incomeInputSum = document.querySelector("#incomeSum");

const expenseInputName = document.querySelector("#expenseName");
const expenseInputSum = document.querySelector("#expenseSum");
const expenseButton = document.querySelector("#expenseButton");
const expensesList = document.querySelector("#expenses");
const expenseAmount = document.querySelector("#expenseAmount");

incomeButton.addEventListener("click", addIncome);
console.log(incomeAmount);
function addIncome() {
  let incomeName = incomeInputName.value;
  let incomeSum = Number(incomeInputSum.value);

  const incomeItem = `<div class="content-tracker__item">${incomeName} - ${incomeSum}<small>₽</small></div>`;

  incomesList.insertAdjacentHTML("beforeend", incomeItem);

  incomeInputName.value = "";
  incomeInputSum.value = "";
  incomeAmount += incomeSum;
  balance += incomeSum;
  checkInput();
}

function checkInput() {
  if (incomeInputName.value == "" || incomeInputSum.value == 0) {
    incomeButton.setAttribute("disabled", "true");
    incomeButton.style.opacity = "0.7";
  } else {
    incomeButton.removeAttribute("disabled");
    incomeButton.style.opacity = "1";
  }
}
incomeInputName.addEventListener("input", checkInput);
incomeInputSum.addEventListener("input", checkInput);

Я ввожу значение в incomeInputSum, и хочу, чтобы при нажатии на кнопку значение incomeAmount менялось, но почему-то не работает. Что делать?