Remove multiple html5 data-attributes with jquery

Question

So jquery api says the following:

Removing data from jQuery\'s internal .data() cache does not effect any HTML5 data- attributes in a document; use .

Answer 1

You can loop all of the data attributes of specific element and filter for index of a sub-string.

REMOVE_ATTR I used the .removeAttr() method, but you may be able to use the .removeData() method depending on how the data-attribute was created. Substitute or combine as you see fit.

 $.each($('div').data(), function (i) {
      var dataName = i, criteria = "lorem";
      if (dataName.indexOf(criteria) >= 0) { 
          $('div').removeAttr("data-"+dataName);
      }
 });

SET NULL You can also optionally set the data-attribute to null depending on your business logic.

$.each($('div').data(), function (i) {
    var dataName = i, criteria = "lorem";
    if (dataName.indexOf(criteria) >= 0) { 
       $('div').data(dataName, "");
    }
});