Use JQuery to select and change the remaining elements with the same class

I have multiple divs containing the same class, after someone clicks on one of the divs, I want to perform two actions -

1. Add class "ABC" to the div that was clicked

2. Add class "DEF" to all the other divs containing the same class

Example -

<div class="ZZZ"></div>
<div class="YYY"></div>
<div class="YYY"></div>
<div class="YYY"></div>
<div class="ZZZ"></div>

If someone clicks the 2nd div, the results should look like this -

<div class="ZZZ"></div>       
<div class="YYY ABC"></div>   <--clicked
<div class="YYY DEF"></div>   
<div class="YYY DEF"></div>
<div class="ZZZ"></div>       

How can this be accomplished with JQuery?

Thanks!

- - , .
.

Recent Questions...