How to pass a JavaScript variable to DIV tag?

Question

I am trying a code to pass a javascript variable to the div tag to change its attribute. If anyone knows how to do this, help me.

<div id="rate" class="money" data-wpac-chan=""></div>

I want to pass a javascript variable to the data-wpac-chan.

<script type="text/javascript">    
    var div = document.getElementById("rate").data-wpac-chan = "bal";
</script>

It is not working. I want to replace data-wpac-chan=" " to data-wpac-chan="bal"

Answer 1

This should do it:

document.getElementById("rate").setAttribute("data-wpac-chan", "bal");

SetAtrribute will set any attribute on an HTML element.

Answer 2

You can also use dataset to assign the value to the attributes that has data- . Notice that, you need to use the camelcase as attribute name. So, wpac-chan becomes wpacChan

 document.getElementById("rate").dataset.wpacChan = 'bal'

 <div id="rate" class="money" data-wpac-chan="">sadasd</div>