What are the benefits of using attr() instead of using addClass() in jquery?
addClass() has several benefits over manipulating the class with attr('class'):
It's semantically clearer. addClass and removeClass manipulate the element's class attribute (or className property), and that's about it. It's a little more difficult for them to make the code lie to you. If you said $whatever.addClas("selected"), you'd get a runtime error, whereas if you said $whatever.attr('clas', 'selected'), it just wouldn't appear to do anything. It'd still "work" from JS's point of view, though, because who knows? You could want to set a clas attribute. That's the kind of thing that happens when you try to use a Swiss army knife as a can opener.
It works with multiple classes. If you use attr to add and remove CSS classes, and there will ever be more than one (which is rather common, actually), you'd have to do some string processing to make sure not to disturb any other applied classes or have the same class repeated 50 times. addClass and removeClass do that for you.
It's apparently a lot faster.
I can't really think of any benefits of attr('class'...) over addClass. Generally, attr is for when you don't have some other built-in way to manipulate the attribute. In this case you do, so you should probably use that.