Hide Or Show All Divs For A Certain Value Of A Data Attribute

I'm trying to use HTML5 valid markup here, so instead of adding to values to class I want to use the data-*='' to show/hide certain divs.

Solution 1:

Simply use attribute-equals notation:

$('div[data-chattingto="cheesecake"]').hide();

And a JS Fiddle demo, kindly provided by CrunchyV. References:

• [attribute="value"] selector.

Solution 2:

That would be:

$('div[data-chattingto = "cheesecake"]').show();

And

$('div[data-chattingto = "cheesecake"]').hide();

Share