如何实现多个<a>标签，点击让他背景和里面的文字颜色改变，再点次还原。做出类似复选的效果。

html代码
<div class="part_1">
            <a href="#">点我啊，你他喵点我啊</a>
            <a href="#">点我啊，你他喵点我啊</a>
            <a href="#">点我啊，你他喵点我啊</a>
            <a href="#">点我啊，你他喵点我啊</a>
            <a href="#">点我啊，你他喵点我啊</a>
            <a href="#">点我啊，你他喵点我啊</a>
            <a href="#">点我啊，你他喵点我啊</a>
            <a href="#">点我啊，你他喵点我啊</a>
        </div>
jq代码
<script>
        $(function(){
            $(".part_1 a").toggle(function(){
                $(this).addClass("red");
            },function(){
                $(this).removeClass("red")
            })
        })
        </script>
css代码
.part_1 {width: 150px;border: 1px solid #000000;}
.part_1 a{display: block;height: 50px;width: 150px;text-align: center;line-height: 50px;}
.red{background-color: red;color: white;}
就酱 = - =。

Good!!!!