親関数の$ thisを選択するには？

Question

Weatherウィジェットのクラスとパラメータxml-urlを持つdivはほとんどありません。 Jqueryの使用私はすべてのdivをweather-widgetクラスでループしています。次にコールバック関数で私はxmlデータをプルするajaxリクエストを作成しています。その後、私はコンテンツをループしています。私の質問は、天気予報ウィジェットを選択し、そのHTMLを貼り付ける方法です。私は

HTML

<div class="weather-widget" xml-url='www.firstURL.com/output.xml'> 
    <div class="panel panel-default"> 
     <div class="panel-heading">Vancouver</div> 
     <ul class="list-group"> 
      <!-- append using jquery --> 
     </ul> 
    </div> 
</div> 
<div class="weather-widget" xml-url='www.secondURL.com/output.xml'> 
    <div class="panel panel-default"> 
     <div class="panel-heading">Abbotsford</div> 
     <ul class="list-group"> 
      <!-- append using jquery --> 
     </ul> 
    </div> 
</div> 

Javascriptを

$(".weather-widget").each(function(){ 


    $.ajax({ 
     url: $(this).attr('xml-url'), 
     type: "GET", 
     dataType: "xml", 
     success: function(xml){ 
      $(xml).find("entry").each(function() { 

       $(What Should I PUT HERE).find(ul).append('<li class=\"list-group-item\">'+$(this).find("title").text()+'</li>'); 

      }); 
     } 
    }); 


}); 

Answer 1

あなたは既に要素を持っている、それがeach()ループ

$(".weather-widget").each(function(index, elem) { 
    $.ajax({ 
     url: $(this).attr('xml-url'), 
     type: "GET", 
     dataType: "xml", 
     success: function(xml) { 
      $(xml).find("entry").each(function() { 
        $(elem).find('ul').append('<li class=\"list-group-item\">' + $(this).find("title").text() + '</li>'); 
      }); 
     } 
    }); 
}); 

Answer 2

まあ一つの選択肢である使用してクロージャを持っている：

$(".weather-widget").each(function(){ 
    (function(el){ 
     // .. 
     $(xml).find("entry").each(function() { 
      $(el).find(ul).append('<li class=\"list-group-item\">'+$(this).find("title").text()+'</li>'); 
     // ^^^^ 
     }); 
     // .. 
    })(this); 
}); 

Answer 3

ちょうどあなたの内部にアクセス可能である関数内の要素を、離れて保存します成功コールバック。 Ajax呼び出し（$アヤックス）がそれへの参照を追加する前に

$(".weather-widget").each(function(){ 
    var $thisWidget = $(this); 

    $.ajax({ 
     url: $(this).attr('xml-url'), 
     type: "GET", 
     dataType: "xml", 
     success: function(xml){ 
      $(xml).find("entry").each(function() { 

       $thisWidget.find(ul).append('<li class=\"list-group-item\">'+$(this).find("title").text()+'</li>'); 

      }); 
     } 
    }); 


});