Removing data attributes from HTML using jQuery

Question

Can\'t seem to get this one to work...

I have a page that hides certain links. When the DOM is loaded, I\'m using jQuery to toggle some of those elements. This is drive

Answer 1

Set it to a blank string:

$(this).attr("data-usr", "");

I second what Kolink said: check the DOM, not the source. (Chrome: Ctrl + Shift + i).

Answer 2

Changing the DOM doesn't affect the source. It affects the DOM, which you can view with the Inspector/Developer Tools. Right click => View Source will give you the original source of the page, not the actual current source as modified by JavaScript.

Answer 3

Why don't you set the value to a random value or empty variable instead if removeAttr does not work..

$(this).attr("data-usr" , '');

$(this).prop("data-usr" , '');

Answer 4

As others have stated. Checking the source will only show the original unedited source for the webpage. What you need to do is check the DOM using developer tools.

I've just checked everything in Chrome's inspector on jsfiddle here and the attribute is definitely being removed as well as the data.