【jQuery】特定文字列が含まれているかを判定｜:contains()

特定文字列が含まれている時、手間かかるかもと思っていたけどif文も書かずにクリア出来て嬉しかったのでご紹介します。
今回はリストの中に、特定文字が存在していたらを判断します。

HTML

<div class="demo1">
　<p>下のボタンを押して特定文字列が含まれる文字色を変更します。</p>
　<ul>
　　<li>Google</li>
　　<li>Apple</li>
　　<li>Facebook</li>
　　<li>Amazon</li>
　</ul>
　<div class="btn">「Google」を赤にする</div>
　<div class="btn2">「Apple」を黒にする</div>
　<div class="btn3">「Facebook」を青にする</div>
　<div class="btn4">「Amazon」をオレンジにする</div>
　<div class="btn5">色をもとに戻す</div>
</div>

jQuery

// Googleボタン
$(".demo1 .btn").on("click", function(){
　var txt = "Google";
　$(".demo1 li:contains(" + txt + ")").css({color: "#e24f72"});
});
// Appleボタン
$(".demo1 .btn2").on("click", function(){
　var txt = "Apple";
　$(".demo1 li:contains(" + txt + ")").css({color: "#4e4e4e"});
});
// Facebookボタン
$(".demo1 .btn3").on("click", function(){
　var txt = "Facebook";
　$(".demo1 li:contains(" + txt + ")").css({color: "#1c70c8"});
});
// Amazonボタン
$(".demo1 .btn4").on("click", function(){
　var txt = "Amazon";
　$(".demo1 li:contains(" + txt + ")").css({color: "#e78433"});
});
// もとに戻すボタン
$(".demo1 .btn5").on("click", function(){
　$(".demo1 li").css({color: "#cccccc"});
});