Jquery
$(function() {
//인기/추천강좌 상단 배너롤링
$(".lecture_cont").hide();
$(".lecture_cont").eq(0).show();
$(".recom_lecture_menu li a").each(function(i){
$(this).bind("click",function(event){
$(".recom_lecture_menu li").removeClass("on");
$(this).parent().addClass("on");
});
var num = i;
$(this).bind("click",function(){
$(".lecture_cont").hide();
$(".lecture_cont").eq(num).show();
});
});
return false;
});
<ul class="recom_lecture_menu">
<li class="on"><a href="#lecture_cont1">인기/추천강좌 탭 첫번째</a></li>
<li><a href="#lecture_cont2">인기/추천강좌 탭 두번째</a></li>
</ul>
<!--lecture_cont1-->
<div id="lecture_cont1" class="lecture_cont" style="display:block;">
<dl>
<dd class="thumbs"><a href="#"><img src="" width="307" height="220" alt="송파점"/></a></dd>
<dt><span>[1송파점]</span> <br/> 트니트니 키즈챔프(12~19개월)</dt>
</dl>
<dl>
<dd class="thumbs"><a href="#"><img src="" width="307" height="220" alt="송파점"/></a></dd>
<dt><span>[1송파점]</span> <br/> 트니트니 키즈챔프(12~19개월)</dt>
</dl>
</div>
<!--//lecture_cont1-->
<!--lecture_cont2-->
<div id="lecture_cont2" class="lecture_cont" style="display:none;">
<dl>
<dd class="thumbs"><a href="#"><img src="" width="307" height="220" alt="송파점"/></a></dd>
<dt><span>[1송파점]</span> <br/> 트니트니 키즈챔프(12~19개월)</dt>
</dl>
<dl>
<dd class="thumbs"><a href="#"><img src="" width="307" height="220" alt="송파점"/></a></dd>
<dt><span>[1송파점]</span> <br/> 트니트니 키즈챔프(12~19개월)</dt>
</dl>
</div>
<!--//lecture_cont2-->