How to select elements with the exact name of one class?

Question

that's why I am,

<ul> <li class="foo"> abc </li> <li class="foo bar"> def </li> </ul> 

If I do $('.foo').css('font-size','x-large');

this will change both large font li elements. How can I select a class with only "foo" but not "bar"?

Thanks!

Answer 1

You can use the following attribute selector, I suppose:

 $('li[class=foo]'); 

It uses JSFiddle . )

Answer 2

This should work:

 $('.foo:first').css('font-size','x-large');