难点，我弄了好久都不太明白
在一个页面中，左侧有abc，点击左侧的a，相应的a的内容出现在右边，
点击左侧的b，相应的b的内容出现在右边，
点击左侧的c，相应的c的内容出现在右边，

，并且abc在同一个页面，这个效果怎么弄啊，请高手指教

<div class="left_div">
  <ul>
  <a href="">a</a>
  <a href="">b</a>
  <a href="">c</a>
  </ul>
</div>

<div class="right_div">
  <div>a的内容a的内容a的内容a的内容a的内容a的内容a的内容a的内容a的内容a的内容a的内容a的内容a的内容。。。</div>
  <div>b的内容b的内容b的内容b的内容b的内容b的内容b的内容b的内容b的内容b的内容。。。</div>
  <div>c的内容c的内容c的内容c的内容c的内容c的内容c的内容c的内容c的内容c的内容c的内容c的内容。。</div>
</div>

我不想通过拖拉滚动条看c的内容，

我想通过点击左侧的c，然后直接跳到c的内容，ab的内容也有，只是点击c跳的位置不一样，但显示是c的内容

------解决方案--------------------
<div class="left_div">
<ul>
<a href="#" onclick="showdiv('a'),hidediv('b','c')">a</a>
<a href="#" onclick="showdiv('b'),hidediv('a','c')">b</a>
 <a href="#" onclick="showdiv('c'),hidediv('a','b')">c</a>
</ul>
</div>

<div class="right_div">
<div id="a" style="display: none">a的内容a的内容a的内容a的内容a的内容a的内容a的内容a的内容a的内容a的内容a的内容a的内容a的内容。。。</div>
<div id="b" style="display: none">b的内容b的内容b的内容b的内容b的内容b的内容b的内容b的内容b的内容b的内容。。。</div>
<div id="c" style="display: none">c的内容c的内容c的内容c的内容c的内容c的内容c的内容c的内容c的内容c的内容c的内容c的内容。。</div>
</div>
<script>
function showdiv(obj){
var divSome = document.getElementById(obj);
divSome.style.display="block";

}
function hidediv(one,two){
var hideOne = document.getElementById(one);
var hideTwo = document.getElementById(two);
hideOne.style.display="none";
hideTwo.style.display="none";

}
</script>