<div class="spisok">
     <ul>
         <li><a class="" href="#text1">Кнопка №1</a></li>
         <li><a class="" href="#text2">Кнопка №2</a></li>
         <li><a class="" href="#text3">Кнопка №3</a></li>
         <li><a class="" href="#text4">Кнопка №4</a></li>
         <li><a class="" href="#text5">Кнопка №5</a></li>
         <li><a class="" href="#text6">Кнопка №6</a></li>
         <li><a class="" href="#text7">Кнопка №7</a></li>
         <li><a class="" href="#text8">Кнопка №8</a></li>
     </ul>
</div>
<div class="text">
     <div class="text1">Текст1</div>
     <div class="text2">Текст2</div>
     <div class="text3">Текст3</div>
     <div class="text4">Текст4</div>
     <div class="text5">Текст5</div>
     <div class="text6">Текст6</div>
     <div class="text7">Текст7</div>
     <div class="text8">Текст8</div>
</div>
<script type="text/javascript">
$(function () {
var arSpisok = $('div.text > div');
arSpisok.hide();
    $('div.spisok ul a').click(function () {
      
        arSpisok.filter(this.hash).show();
   
});
    
});
</script>
Есть кнопки по нажатию которых должен появляться текст, в соответсвии с нажатой кнопкой.
Поместил тексты в массив. 
var arSpisok = $('div.text > div');
В функции клик 
arSpisok.filter(this.hash).show();
 не выполняется
Можно сделать большой код с скрытием/появлением каждого элемента по id или классу, но это говорят очень плохо 
Как сделать так чтобы кнопка показывала именно тот текст, который соостветвует кнопке ? Мне просто в голову не приходит как это сделать обобщенно, чтобы по нажатию любого <a> определялся нужный элемент массива.(если я все правильно понимаю)