Question

I an trying to change a plug in from being based on anchor classes to being based on a custom attribute.

so from: a.categoryname

to: a data-category=”categoryname”

The plug in I am customising is:
http://www.designchemical.com/blog/index.php/jquery/create-an-automatic-content-filter-using-jquery-css-classes/

I won’t post all the code here as I am almost there but but am having a problem with this line:

$("#demo-list li a."+getText).fadeIn();

instead of fading in #demo-list li a.”getText), I want it to fade in #demo-list li a, whose attribute “category-name” is “getText”

Here is my horrendous attempt…

$("#demo-list li a).attr("data-category").val(getText).fadeIn();

Needless to say it doesn’t work… I know enough to know the syntax is not right but not enough to fix it…

Can anyone help me out here please?

thanks

Answer 1

You could just do this:

$("#demo-list li a[data-category='" + getText + "']").fadeIn();

What this does is use the attribute equals selector to select the a element whose attribute data-category equals the value of getText.