最小化DEMO测试代码

最简添加删除class：

// for test
function $(id){ return document.getElementById(id); }


// add or remove class
$('test1').onclick = function(){
    $('test2').className = /\s*on$/.test($('test2').className) ? 'test_class' : 'test_class on';
};

最简显示隐藏：

// for test
function $(id){ return document.getElementById(id); }


// display none or block
$('test1').onclick = function(){
    $('test2').style.display = $('test2').style.display == 'none' ? 'block' : 'none';
};

最简Tab切换：

<style>
        ul li{cursor: pointer;}
        div{display: none;}
        .on{border: 1px solid #ddd;}
        .on div{display: block;}
</style>


<ul id="x">
    <li>Tab1<div>content1</div></li>
    <li>Tab2<div>content2</div></li>
    <li>Tab3<div>content3</div></li>
</ul>


<script type="text/javascript">
document.getElementById('x').onclick = function(e){
    var w=window.event,t=(e||w).target||w.srcElement,c='className',x=this.x;
    x?x[c]='':0;tthis.x=t;t[c]='on';
};
</script>

Via 最小化DEMO测试代码