jq中的toggle和toggleClass

最近用到元素类的切换和div的显示与隐藏，用愚蠢的方法做完了项目，才发现有更简洁的方法。

下面是css和html部分：

<style>
        div{
            background-color: black;
            width:300px;
            height: 300px;
        }
        .one{
            background-color: red;
        }
    </style>

 <div></div>
    <button id='but'>click me</button>

（1）原始情况下我们如果要想触发事件隐藏一个div，应该是这样的:：

 $('#but').click(function(){
        if($('div').css('display')=='block'){
            $('div').css('display','none');
        }else{
            $('div').css('display','block');
        }
    });

有了toggle方法之后，简化成如下： <