jQuery：idの内容を取得

Question

jQuery DOMに関するいくつかの助けが必要です。 idの内容を抽出する必要があります。ユーザーが選択できるリストがあり、マップのhotspotをフィルタリングします。ユーザーが選択したら、filtertitleに新しい選択したフィルターを表示します。コンテンツにショッピング/ダイニングがあるため、「id」をフィルタのタイトルに適用できますが、コンテンツについてはわかりません。誰かよろしくお願いします。

HTML

<div class="map-filter"> 
    <div class="filtertitle">All Categories</div> 
    <ul class="filter-list"> 
     <li class="active" id="All Categories">All Categories</li> 
     <li id="Shopping">Shopping/Dining</li> 
     <li id="Hotel">Hotels & Resorts</li> 
     <li id="Art">Art Galleries</li> 
    </ul> 
</div> 

jQueryの

$('.filter-list li').click(function(){ 
    var id = $(this).attr('id'); 
    $(this).siblings().removeClass('active'); 
    $(this).addClass('active'); 
    $('.filtertitle').html(id); //This part is where I set the id 
}); 

Answer 1

使用.text()、それはあなたの希望要素のテキストコンテンツを提供します。

$('.filtertitle').html($(this).text()); 

HTMLコンテンツの場合.html()を使用します。

Answer 2

私はあなたが正しく求めているものを理解してるなら、あなたはこのような何かを試すことができます。

$('.filter-list li').click(function(e){ 
    $(this).siblings().removeClass('active'); 
    $(this).addClass('active'); 
    $('.filtertitle').html($(e.currentTarget).text()); 
}); 

JSFiddle - https://jsfiddle.net/583zgs57/

Answer 3

単純な設定IDの代わりに、$（this）.text（）;を使用できます。現在の要素のテキストコンテンツを取得します。

$('.filter-list li').click(function(){ 
    var id = $(this).attr('id'); 
    $(this).siblings().removeClass('active'); 
    $(this).addClass('active'); 
    $('.filtertitle').html($(this).text()); 
});