Simple Selectable with Jquery

Question

I have just 3 divs all with a background color of blue.

I need jQuery to make each box selectable.
When the box is clicked/selected, jQuery should add class .selected with a different background color to red. All the others not selected should change back to blue when clicking another div.

Here's the css

.block {
    width: 300px;
    padding: 10px;
    background: blue;
    color:white;
    margin-top:5px;
}

.selectable {
    background: red;
}

Here's the html

<div class="block">
    Some stuff here
</div>

<div class="block">
    Some stuff here
</div>

<div class="block">
    Some stuff here
</div>

​How do I do it with jQuery?
Here's all the actual jsfiddle

Answer 1

Try this jsFiddle example.

$('.block').click(function() {
    $('.block').removeClass('selectable');
    $(this).addClass('selectable');
});​