Question

I have a UL List set up as follows:

<div id="menu">
 <ul>
   <li>
    <a href="step-1" />
   </li>
   <li>
    <a href="step-2" />
   </li>
 </ul>
</div>

I am trying to drill into the “a href” in that list and change a class attribute and I am having some trouble.

I have tried the following but it doesn’t seem to be doing the trick, can someone help steer me straight?

 var menuItem = $('#menu ul li').find('a:has(href="#step-'+num+'")');
 menuItem.removeClass('disabled');
 menuItem.addClass('done');

Answer 1

$('#menu ul li a[href^="step"]').removeClass('disabled').addClass('done');

DEMO

Note

^= is Attribute Starts With Selector selector, in this case it point out those a whose href start with step

In your approach

 var menuItem = $('#menu ul li').find('a[href^="step"]');
 menuItem.removeClass('disabled');
 menuItem.addClass('done');

According to fiddle share in comment

$('#wizard ul li a[href="#step-'+ step +'"]').removeClass('disabled').addClass('done');

not

$('#menu ul li a[href="#step-'+ step +'"]').removeClass('disabled').addClass('done');

There is nothing with id=menu, it is id=wizard

DEMO