What am I getting wrong in this Jquery code, wishing to select an element where attribute is equal to particular value

Question

I wish to just select and place border around .L1Cell element where attribute name parent equals to Workstaion . However it's selecting all .L1Cell elements it seems.

Here's the JSFIDDLE

$(document).ready(function () {

          var firstLevel = $('#MenuContainer').find('.FirstLevel').attr('parentname','Desktop-Mobile'); 

    firstLevel.find('.L1Cell').attr('catname','Workstation').css('border','3px solid black');


alert('running');

    });

Answer 1

Your selector is wrong. You would have to access it like so

firstLevel.find('.L1Cell[catname="Workstation"]').css(...)

You are simply setting every attribute to Workstation and adding .css() . Because .attr() is here to retrieve data from certain attributes and to set certain values for attributes. Not for searching something !

Some documentation on .attr():

• http://api.jquery.com/attr/

The right thing you are looking for is an Attribute Selector, documentation goes here:

• http://api.jquery.com/attribute-equals-selector/