탭메뉴 링크 클릭시 탭메뉴 고정시키려면

아래 탭메뉴를 인터넷에서 찾아서 사용하고 있습니다.

A를 클릭시 보이는 메뉴를 클릭시에는 A상태가 유지됩니다.

B를 클릭후 보이는 메뉴를 클릭시에는 B가 유지되지 않고 A로 돌아가 버립니다.

어떻게 수정을 해주면 되나요??

(아래 원본 소스는 탭메뉴가 3개 이지만

3번째는 지우고 현재 2개만 사용하고 있습니다.)

<script type="text/javascript">

$(function () {

 tab('#tab',0);

});

function tab(e, num){

    var num = num || 0;

    var menu = $(e).children();

    var con = $(e+'_con').children();

    var select = $(menu).eq(num);

    var i = num;

    select.addClass('on');

    con.eq(num).show();

    menu.click(function(){

        if(select!==null){

            select.removeClass("on");

            con.eq(i).hide();

        }

        select = $(this);

        i = $(this).index();

        select.addClass('on');

        con.eq(i).show();

    });

}

</script>

<ul class="tab" id="tab">

    <li>A</li>

    <li>B</li>

    <li>C</li>

</ul>

<div class="tab_con" id="tab_con">

    <div>1st Contents</div>

    <div>2nd Contents</div>

    <div>3rd Contents</div>

</div>