Assigning Individual Keys Of Object Stored In Jquery.data()

I have custom data stored on elements using jQuery.data() method.

Custom data

I know I can access individ

Solution 1:

Using .data() to set a value, won't change the values in the element while you inspect it, it would store that data internally. If you want to reflect those changes to the DOM element, then you should use .attr() like this,

  $('#mydiv').data('test')["1"] = "pear"
  $('#mydiv').attr('data-test', JSON.stringify($('#mydiv').data('test')));

DEMO

Inspect that particular element to verify the changes.

Solution 2:

Try this

$('#mydiv').data('test')["1"] = "pear";
$('#mydiv').attr('data-test',function(_,attr){
   returnJSON.stringify(attr);
});