jquery data do not match dom attribute

Question

I have an weird issue with jquery data function. Here is the fiddle

As you can see I update the active data but I cannot see the dom data-active attribute value change, although I re-query the active data, It writes the changed value. $.data() do not update the attribute on the dom when I inspect it.

Answer 1

jQuery data api does not depends on the element attribute although it uses data-<key> to fetch the initial value if it is available.

jQuery uses an internal javascript object to maintain the data value of objects

If you want to update the attribute then you will have to use .attr('data-<key>', '<value>')