Question

ummm, probably a simple one… the code below only works with visible (show()) elements how do I get it select the first hidden element instead?

Jquery

$(".postSelectedRules").each(function() {
    $(this).parents("#idruleB-"+$(this).attr("id").substr(8)+":hidden:first").css('background', '#bbbbbb');
});

Html

<a id="idruleA-1" class="postSelectedRules" href="#">1</a>
<div class="postStuff">
    <div class="postRules">
        <span id="idruleB-1" class="postRulesSelect">1</span>
        <span id="idruleB-2" class="postRulesSelect">2</span>
    </div>
</div>

Answer 1

Your code doesn’t make a lot of sense. You’re searching the parents of the matching nodes for node that has the same ID as the current node? IDs should be unique.

As for excluding hidden items the general form would be something like:

$(this).parents(":someClass:visible:first").addClass("blah");

Also instead of:

css('background', '#bbbbbb');

I’d highly recommend using classes instead if possible. Adding and removing CSS attributes is problematic. Classes are easy.