jq点击之后改变样式，点击另一个时另一个改变样式，之前点击的恢复原状

<div class="top fl">
    <div class="top_lf fl">
        <div class="box1 kou">小格口</div>
        <div class="txt1">
            <p>省内8元起</p>
            <p>省外10元起</p>
        </div>
    </div>
    <div class="top_middle fl">
        <div class="box3 kou">中格口</div>
        <div class="txt1">
            <p>省内10元起</p>
            <p>省外14元起</p>
        </div>
    </div>
    <div class="top_ri fr">
        <div class="box2 kou">大格口</div>
        <div class="txt1">
            <p>省内12元起</p>
            <p>省外18元起</p>
        </div>
    </div>
</div>

<script>
        $('.top').on('click','.kou',function(){
            $(this).addClass("kou_active").parent().siblings().children().removeClass("kou_active");
        });
</script>