Замена текста в div при нажатии на кнопку, как реализовать?

Question

[Fedor177]

Здравствуйте!
Столкнулся с такой проблемой, нужно заменять текст в блоке при нажатии.

<ul>
<li class="active" data-price1="10" data-price2="20">Кнопка 1</li>
<li data-price1="100" data-price2="200">Кнопка 2</li>
<li data-price1="1000" data-price2="2000">Кнопка 3</li>
</ul>
<div id="div1">10</div>
<div id="div2">20</div>

К примеру, при нажатии на кнопку 3, цена в div1 и div2 должна изменяться на 1000 и 2000.

Из JS данные подставляются, а вот как взять data параметры и подставить их не понимаю.

Answer 1

[Andrey Tsvetkov]

event.target.getAttribute('data-price1')

Comments

[Fedor177]

А подробнее можно?

[Andrey Tsvetkov]

Не самое лучшее решение, но для понимания как делать должно быть достаточно

document.querySelector("ul").addEventListener("click", function (event) {
    if(event.target.hasAttributes("data-price1")) {
        document.getElementById("div1").innerText = event.target.getAttribute("data-price1");
    }
    if(event.target.hasAttributes("data-price2")) {
        document.getElementById("div2").innerText = event.target.getAttribute("data-price2");
    }
}, true);