how to set data-value from javascript

Question

Hello I would like to know how I could set the data-value using javascript

i have this:

  optionsList.forEach((o) => {
    o.addEventListener("click", () => {
      selected.innerHTML = o.querySelector("label").innerHTML;
      let input = o.querySelector("input").value;
      optionsContainer.classList.remove("active");
    });
  });

I take the value of my input which is an id and I wanted to set the data-value in my selected element

like this:

          <div class="selected" data-value="1">
            Select Video Category
          </div>

I need this value to do an array search

my input structure:

Really about time for you to not ask for every single issue in your jQuery conversion and start researching yourself some of the basic fundamentals [MDN - Using Data Attributes](https://developer.mozilla.org/en-US/docs/Learn/HTML/Howto/Use_data_attributes) — charlietfl, Jul 12 '20 at 14:23
You are just playing word games with those comments. You and I both know you have asked a 1/2 dozen questions in last 24 hours regarding your jQuery to vanilla js conversion. I have also helped you on some of them. That doesn't mean you shouldn't be doing research on basic fundamentals though or looking for similar questions [How much research effort is expected of Stack Overflow users?](https://meta.stackoverflow.com/questions/261592/how-much-research-effort-is-expected-of-stack-overflow-users) — charlietfl, Jul 12 '20 at 14:43

score 1 · Accepted Answer · answered Jul 12 '20 at 14:22

1

You can set by document.querySelector('.selected').setAttribute("data-value", "your-input-value");

answered Jul 12 '20 at 14:22

GMKHussain

3,342
1
21
19

score 1 · Answer 2 · answered Jul 12 '20 at 14:22

1

Just set .dataset.value.

document.querySelector('.selected').dataset.value = 2;

answered Jul 12 '20 at 14:22

Unmitigated

76,500
11
62
80

how to set data-value from javascript

2 Answers2