Динамически текст можно менять обращаясь из JS к id элемента, для этого в любом div элементе, в котором вы хотите менять динамически текст, вы должны присвоить id блоку.
Было:
<td class="editable" data-name="model-1-price">$1000.00</td>
Стало:
<td class="editable" data-name="model-1-price" id = "galaxys10price">$1000.00</td>
Я присвоил элементу таблицы id "galaxys10price", в JS теперь я могу оперировать с ним.
Я написал простенькие функции по изменению цены по нажатию кнопок
Код кнопок:
<button class = "w3-button w3-round w3-yellow"> change price </button>
<button class = "w3-button w3-round w3-yellow"> return price </button>
Перейдем к JS
let firstPrice = "1000.00" // объявляю переменную начального значения, это не столь важно, для примера сойдет
let galaxyPrice = document.getElementById('galaxys10price') // здесь я получаю один лишь элемент с ID "galaxys10price"
function changeGalaxyPrice(){
galaxyPrice.innerText = "$1200.00" // var.innerText заменяет внутренний HTML текст
}
function returnGalaxyPrice(){
galaxyPrice.innerText = firstPrice // тут то же самое что и в первой функции, но я возвращаю, можете покликать
}
После добавления функционала, вы должны в onClick кнопок прописать выполнения этих функции:
<button class = "w3-button w3-round w3-yellow" onclick = changeGalaxyPrice()> change price </button>
<button class = "w3-button w3-round w3-yellow" onclick = returnGalaxyPrice()> return price </button>
Надеюсь помог, удачи!