クリック時のJQuery fadeOutリスト要素

Question

私は、順序付けられたリストでクリックされた要素をフェードアウトしようとしています。 on（）は、次に操作できる要素を返すようですが、HTMLでクリックした可視のliを実際にフェードアウトするセレクタを生成するにはどうすればよいですか？ ありがとう！ここで

は、問題の行が下の方にある、私のコードです：

$("#steplist").on("click", ".step", function() { 
     var stepIndex = 0; 
     var li = this; // is the returned line 

     //gets index of clicked line in array by looping through elements 
     while (li.previousElementSibling) { 
      stepIndex++; //increments index counter 
      li = li.previousElementSibling; //sets li to be next li 
     } 

     //sets vars to values in temp, time fields 
     var temp = $("#temp").val(); 
     var time = $("#time").val(); 

     if (temp == 0 || time == 0) { 
      //alert("removing step" + stepIndex); 
      steps.splice(stepIndex, 1); 
     } else if (temp != 0 && time != 0) { 
      //needSelectorHere.fadeOut(3000, function(){ 
     }); steps.splice(stepIndex, 1, [temp, time]); 
} 
updateMash(); 
}); 

Answer 1

ある$(this)あなたがクリックした要素を参照すると、$(this).index()はその位置を子として返しますその親である。

jsFiddle

HTML：

<ol> 
    <li>item 1</li> 
    <li>item 2</li> 
    <li>item 3</li> 
</ol> 

JS：

$('li').on('click', function() { 
    alert($(this).index()); 
    $(this).fadeOut(); 
}) 

Answer 2

要素をクリックしたのセレクタが$(this)あなたが使用することができます

$('div').click(function(){ 
 
    $(this).animate({ 
 
    'marginLeft' : '100px' 
 
    },800); 
 
});

div{position:relative;height:100px;width:100px;} 
 
    #red{background-color:red;} 
 
    #green{background-color:green;} 
 
    #blue{background-color:blue;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 

 
<div id="red"></div> 
 
<div id="green"></div> 
 
<div id="blue"></div>