未知のReferenceError：.parent（）またはclosest（）

Question

ループ内で、以下のような複数のdivが表示されます。

<div id="author-id-3" class="follow-me">       
    <div class="author-follow"> 
    <a id="3" class="meta-badge"><span class="icon-close"></span> Follow</a> 
    </div>   
</div> 

私はajaxを使用してdb内のデータを更新します。

jQuery('.author-follow').on('click', '.meta-badge', function(e) { 
    e.preventDefault();      

    var user_id   = $('.author-follow a.meta-badge').attr('id'); 

    $.ajax({ 
     ...      
     beforeSend: function() { 
      $('.follow-me .author-follow').fadeOut('fast'); 
      $('<div class="icon-loading"></div>').hide().appendTo('.follow-me').fadeIn('slow'); 

     }, 
     success: function(data) { 
      $('.follow-me .icon-loading').remove(); 
      $('.follow-me').html(ajax_setting.ajax_follow_success).hide().fadeIn('slow'); 
      console.log(user_id); 
     } 

    }) 

}); 

これは、任意の特定のボタンがページ上でクリックされたときに、すべてのfollow-meのdivがajax_follow_success機能で更新されます得ることを引き起こします。それは特定のボタン領域内にしか表示されません。

私が使用してみました：

$toggle = $(this).parent().parent().find('follow-me'); 

beforeSend: function() { 
    $toggle.fadeOut('fast'); 
    $('<div class="icon-loading"></div>').hide().appendTo($toggle).fadeIn('slow'); 
}, 

しかし、その後、私はUncaught ReferenceError: $toggle is not defined

を得た私もclosest()でそれを試してみましたが、私はそれを適切に使用していないので、それは非常に可能性が高い（同様に動作しません）。

beforeSend: function() { 
    $(this).closest('.author-follow').fadeOut('fast');  
    $('<div class="icon-loading"></div>').hide().appendTo($(this).closest('.follow-me')).fadeIn('slow'); 
}, 

私を正しい軌道に乗せるための助けがあれば大歓迎です。

編集：

私も（成功なし）わずかに異なる角度からそれに近づきました。

var div_id   = $('.follow-me').attr('id'); 

beforeSend: function() {     
$('#' + div_id + ' .author-follow').fadeOut('fast');      
$('<div class="icon-loading"></div>').hide().appendTo('#' + div_id + '').fadeIn('slow'); 
console.log(div_id );       
}, 

Answer 1

あなたはそれがタグfollow-meないクラスを探していることを意味クラス.find('follow-me')で.文字を逃しました。

$toggle = $(this).parent().parent().find('.follow-me'); 
//          ^use '.follow-me'