クリックしたテキストのみを表示

Question

なぜ動作しないのか分かりません。段落をリンクする索引段落をクリックして他者を見ないことを見たい。それは私のコードです：

Fiddle

<div class="greyBackground"> 
     <div> 
      <nav> 
       <ul> 
        <a href="#">1234</a> 
        <a href="#">4567</a> 
        <a href="#">7890</a> 
        <a href="#">0987</a> 
       </ul> 
      </nav> 
     </div> 

     <div> 
      <h4>Something</h4> 
       <p>My code 1</p> 
       <p>My code 2</p> 
       <p>My code 3</p> 
       <p>My code 4</p> 
     </div> 
</div> 

$(function() { 

    var myDiv = $(".greyBackground"); 
    var link = $(".myDiv").find("a"); 
    var paragraph = $(".myDiv").find("p"); 

    link.on("click", function(){ 

    var index = $(this).index(); 
     paragraph.hide(); 
     paragraph.eq(index).show(); 

    }); 

}); 

Answer 1

あなたの問題は、そのようなクラスは、ので、あなたのjQueryの何かを見つけることができませんmyDivようがないです。あなたはすでにdivを見つけましたので、作成した変数を使用するだけです。

var myDiv = $(".greyBackground"); 
var link = myDiv.find("a"); 
var paragraph = myDiv.find("p");