0
這裏是我的工作小提琴：http://jsfiddle.net/exlondoner/YvPg9/ 我想要實現的是能夠從媒體類型和排序方式中選擇一個選項（輪廓），我該怎麼做？從不同divs中選擇選項
JS：
$('.media-select-option').on('click', function() {
$(this).addClass('selected');
$('.overlay-close-btn').addClass('checked');
});
HTML：
<div class="overlaymedia">
<div class='media-filter'>
<div class="media-nav" role='contentinfo'>
<div class="media-nav media-menu-container">
<h5 class="media-menu-heading close-overlay-btn">Media Type</h5>
<!-- Media Type: All/Photos/Videos -->
<div class="media-select-option media-all" data-href="">All</div>
<div class="media-select-option media-photos" data-href="">Photos</div>
<div class="media-select-option media-videos" data-href="">Videos</div>
<h5 class="media-menu-heading close-overlay-btn">Sort By</h5>
<!-- Sort By: Latest/Popular -->
<div class="media-select-option media-latest" data-href="">Latest</div>
<div class="media-select-option media-popular" data-href="">Popular</div>
<div class="media-menu-bottom close-overlay-btn">
<div class="overlay-close-btn bottom">Close</div>
</div>
</div>
</div>
</div>
CSS：
.overlay-close-btn:before { content: '×'; }
.overlay-close-btn.checked:before {
content: '✔';
}
.media-select-option {
border: solid 1px #fff;
}
.selected {
border: solid 1px #f00;
}