Стирается невидимое содержимое ячейки

я делаю судоку. Это поле 9х9, в каждое из которых можно вставить цифры. Каждая ячейка таблицы имеет следующий код:

<!--Класс ячейки-->
<td class="game-cell" onclick="cellClick(this)">
                            <!--Невидимые символы (невидимость задается в style.css)-->
                            <div class="pencil-grid">
                                <div
                                    class="pencil-grid-cell pencil-grid-cell-1">
                                    1</div>
                                <div
                                    class="pencil-grid-cell pencil-grid-cell-2">
                                    2</div>
                                <div
                                    class="pencil-grid-cell pencil-grid-cell-3">
                                    3</div>
                                <div
                                    class="pencil-grid-cell pencil-grid-cell-4">
                                    4</div>
                                <div
                                    class="pencil-grid-cell pencil-grid-cell-5">
                                    5</div>
                                <div
                                    class="pencil-grid-cell pencil-grid-cell-6">
                                    6</div>
                                <div
                                    class="pencil-grid-cell pencil-grid-cell-7">
                                    7</div>
                                <div
                                    class="pencil-grid-cell pencil-grid-cell-8">
                                    8</div>
                                <div
                                    class="pencil-grid-cell pencil-grid-cell-9">
                                    9</div>
                            </div>
                        </td>

Но при клике на ячейку и присвоения ей значения, у меня исчезают все классы с именем pencil-grid-cell. Вот код, который делает это.

/** 
    @description ставит на поле нажатую цифру
                    сохраняет последняя нажатую клавишу
    @param {event} e, объект, по которому была нажата ЛКМ
    @return {undefined}
*/
function cellClick(e) {
    changeCellBackground(e);
    if (currentNum) {

        e.textContent = currentNum;
    }
    lastSelectedCell = e;
}
/* */
function changeCellBackground(currentcell) {
    // если пользователь несколько раз нажал на 1 ячейку, то 
    // ничего не делаем
        currentcell.style.background = cellSelectBackgroundColor;
        if (lastSelectedCell){
            lastSelectedCell.style.background = cellBackgroundColor;
        }
}

Я подозреваю, что строчка e.textContent = currentNum; затирает абсолютно все содержимое ячейки, даже невидимое, но как это обойти, я не знаю. Буду благодарен за помощь. Спасибо.