http://stackoverflow.com/questions/16926116/style-the-parent-of-the-current-element
HTML
<ul id="menu">
<li class="gray"><a href="#">All</a></li>
<li class="blue"><a href="#">Item 1</a></li>
<li class="orange"><a href="#">Item 2</a></li>
<li class="green"><a href="#">Item 3</a></li>
</ul>
CSS
.gray {
color: gray;
}
.blue {
color: blue;
}
.orange {
color: orange;
}
.green {
color: green;
}
JavaScript
$('#menu').on('click', 'li', function(event){
event.preventDefault();
var $item = $(event.currentTarget);
$item.siblings().removeClass('active');
$item.addClass('active');
$item.parent().css('border', '1px solid ' + $item.css('color'));
});