Semantic ui menu

Semantic ui menu

HTML

<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/semantic-ui/0.12.0/css/semantic.css">
<script src="http://semantic-ui.com/build/packaged/javascript/semantic.min.js"></script>
<div class="ui secondary pointing menu">
            <a class="active item">
                <i class="home icon"></i>Home</a>
            <a class="item">
                <i class="mail icon"></i>Messages</a>
            <a class="item">
                <i class="user icon"></i>Friends</a>
            
        </div>

JavaScript

$(document).ready(function(){
    $('.ui .item').on('click', function() {
        $('.ui .item').removeClass('active');
        $(this).addClass('active');
        console.log($(this));
    });             
});

/* http://stackoverflow.com/questions/23195009/semantic-ui-tab-and-javascript */