javascript 選択されたタブの太文字とbgカラーを変更する方法を教えてください。

<script type="text/javascript">
    function ChangeTab(tabname) {
        document.getElementById('tab1').style.display = 'none';
        document.getElementById('tab2').style.display = 'none';
        document.getElementById('tab3').style.display = 'none';
        if(tabname) {
            document.getElementById(tabname).style.display = 'block';               
        }
    }
</script>

<ul class="tabs">
    <li><a onclick="ChangeTab('tab1'); return false;" class="tab1" href="#tab1">1Channel ~ 2Channel</a></li>
    <li><a onclick="ChangeTab('tab2'); return false;" class="tab2" href="#tab2">4Channel ~ 8Channel</a></li>
    <li><a onclick="ChangeTab('tab3'); return false;" class="tab3" href="#tab3">16Channel</a></li>
</ul>
<div class="tab" id="tab1">内容</div>
<div class="tab" id="tab2">内容</div>
<div class="tab" id="tab3">内容</div>

<script type="text/javascript">
    ChangeTab('tab1');          
</script>

---

上記の内容で選択されたliを太文字とbgカラーを変更するにはどうすればいいですか。