jQueryのは、私はこのようなリスト持っているリスト項目の最初の文字

Question

に対応するクラスを追加

<ul id="recipes"> 
    <li class="a"><a href='xxx'>Apple Pie</a></li> 
    <li class="a"><a href='xxx'>Almond Slice</a></li> 
    <li class="b"><a href='xxx'>Banana Cake</a></li> 
    <li class="c"><a href='xxx'>Carrot Cake</a></li> 
</ul> 

を目標は、グループにありますthis threadの回答を使用してリストをアルファベット順に追加する必要があります。

Answer 1

$("#recipes li").each(function() { // <-- Run over each li 
    var s = $(this).find("a").html().charAt(0) // <-- takes the first character of link 
    $(this).addClass(s.toLowerCase()) // <-- Add the character as a class to the li 
}) 

$("#recipes li").each(function() { 
 
    var s = $(this).find("a").html().charAt(0) 
 
    $(this).addClass(s.toLowerCase()) 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<ul id="recipes"> 
 
    <li><a href='xxx'>Apple Pie</a></li> 
 
    <li><a href='xxx'>Almond Slice</a></li> 
 
    <li><a href='xxx'>Banana Cake</a></li> 
 
    <li><a href='xxx'>Carrot Cake</a></li> 
 
</ul>

Answer 2

、変数リストを入れて変数をループし、リストの各メンバーのテキスト値のサブストリングとしてクラスを追加します。

var baked = $("#recipes li").get(); 

for(var i = 0; i<baked.length, i++;){ 
    var currentBaked = $(baked[i]).get('a'); 
    currentBaked.parent().addClass(currentBaked.text().substring(0,1)); 
} 

Answer 3

することはできループ各li内部でaの最初の文字を取得し、

$('ul li').each(function() { 
 
    $(this).addClass($(this).find('a').text()[0].toLowerCase()) 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<ul id="recipes"> 
 
    <li><a href='xxx'>Apple Pie</a></li> 
 
    <li><a href='xxx'>Almond Slice</a></li> 
 
    <li><a href='xxx'>Banana Cake</a></li> 
 
    <li><a href='xxx'>Carrot Cake</a></li> 
 
</ul>

Answer 4

は、以下に記載するコード試してみてください小文字にそれを変換：

$(document).ready(function() { 
    $("ul > li").each(function() { 
    var text = $(this).find("a").text(); 
    $(this).addClass(text[0].toLowerCase()); 
    }); 
});