How do I set a data attribute with native js so it is picked up with jquery? I have tried using setAttribute, but that only works for the first occasion an any updates aren't picked up:
var iframeHolder = document.getElementById('test');
iframeHolder.setAttribute('data-test', 5);
var $iframe = $('#test');
console.log($iframe.data('test'));
iframeHolder.setAttribute('data-test', 6); // this doesn't seem to update the underlying data attribute
console.log($iframe.data('test'));
iframeHolder.dataset.test = 6; // neither does this
console.log($iframe.data('test'));<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="test">inspect to see attribute updates</div>Please note, I need to use native js as it is in an iframe that doesn't use jquery (but sets the data attribute in the parent window which does use jquery)