Why maphilight doesn't work via data attribute?

Question

I have an image with map and several areas. I need areas to be always highlited and also change their fillColor on hover. So the only working option is to set data attributes to areas instead of using maphilight on image. So I have this code:

popupItem.('area').each(function() {
    $(this).attr('data-maphilight', '{"alwaysOn":"true","fillColor":"359335","fillOpacity":0.25,"strokeColor":"2d812d"}');  
});  

Areas are given the specified attributes, but maphilight doesn't work.

It works only when I use maphilight on image like this:

popupItem.find('img:not(.maphilighted)').maphilight({
   'strokeColor': '2d812d',
   'fillColor': '359335',
   'alwaysOn': 'true',
   'fillOpacity': '0.25'
});

But in this case I can't change fillColor for a certain area. Is there any other way to solve my problem? Thanks for advice