changing the data-icon in pure javascript

How would I update the data-icon attribute in Javascript?

document.getElementById("btn").data-icon = "&#xe082";

This does not work, as it would for style, or width or whatever.

How would I update the data-icon attribute in Javascript?

document.getElementById("btn").data-icon = "&#xe082";

This does not work, as it would for style, or width or whatever.

Share Improve this question asked Nov 21, 2013 at 22:14 wazzaday 9,6746 gold badges45 silver badges69 bronze badges

Add a ment |

3 Answers 3

Sorted by: Reset to default 3

Use .setAttribute(); for setting attributes to elements

document.getElementById("btn").setAttribute("data-icon", "&#xe082");

Also, you cannot use - when calling objects as it thinks you are trying to subtract, unless you call it like obj['key-name'];

It's an attribute, and for attributes it's setAttribute()

document.getElementById("btn").setAttribute('data-icon', '&#xe082');

Use .setAttribute(); for setting attributes to elements:

document.getElementById("btn").setAttribute("data-icon", "&#xe082");

Also, you cannot use - when calling objects, as it thinks you are trying to subtract, unless you call it like obj['key-name'];.