jQuery approach is to use $.fn.data
but this does not update the dom, only memory - this script makes use of native js element.dataset
- prefers HTML5 dataset
- fallback to elements attribute
data-*
$('#element').dataset('foo', 'bar');
var foo = $('#element').dataset('foo'); // 'undefined' if not set
$('#element').dataset('fooBar', '1'); // <div id="element" data-foo-bar="1"></div>
$('#element').dataset({
'foo': 'bar',
'bla': 'blub'
});
var array = [1, 2, 3];
$('#element').dataset('foo', array);
// uses toString() method - <div id="element" data-foo="1,2,3"></div>
$('#element').removeDataset('foo');
$('#element').removeDataset('foo bar');