スパンの内容に基づいてスパンの背景イメージを変更するにはどうすればよいですか？

Question

誰かがこれを助けることができるのだろうかと思います。私はその内容に基づいてスパンの背景イメージを変更しようとしています。私は数日を過ごしたが、これでグーグルで何かを考え出すことができなかった。スパンがクリックされた後、それが変化し、

<span id="foo" class="bar"> 
    Gallery 
</span> 

そして：私が持っていた

<span id="foo" class="bar"> 
    List 
</span> 

はjQueryを使ってを行くと来る

HTMLは次のように構成されていますこれと一緒に：

$(window).load(function(){ 
    $("span#foo").each(function() { 
     var $el = $(this); 
     var image; 
     var content = $el.text().toLowerCase(); 
     if (content.indexOf("gallery") !== -1) { 
      image = "url(http://www.example.co.uk/images/foursquares.png) 14px 6px/10px 10px no-repeat"; 
     } 
     else if (content.indexOf("list") !== -1) { 
      image = "url(http://www.example.co.uk/images/threelines.png) 14px 6px/10px 10px no-repeat"; 
     } 
     if (image) { 
      console.log("if"); 
      .css("background", image); 
     } 
    }); 
}); 

（これは作者が隣接するdivの背景色を変更したいと思っていたが、もう一度それを見つけることはできませんが）何もしません。

誰もこれを提供できることをすべてのヘルプははるかに高く評価されるだろう。種類に関しては

、

マーク

Answer 1

にtoLowerCaseメソッド（）関数を追加し、これを試してみてください、あなたの文は、 "背景" に "背景画像"

$(window).load(function(){ 
$("span#foo").each(function() { 
    var $el = $(this); 
    var image; 
    var content = $el.text().toLowerCase(); 
    if (content.toLowerCase().indexOf("gallery") !== -1) { 
     image = "url(http://www.example.co.uk/images/foursquares.png) 14px 6px/10px 10px no-repeat"; 
    } 
    else if (content.toLowerCase().indexOf("list") !== -1) { 
     image = "url(http://www.example.co.uk/images/threelines.png) 14px 6px/10px 10px no-repeat"; 
    } 
    if (image) { 
     console.log("if"); 
     $el.css("background-image", image); 
    } 
}); 
}); 

Answer 2

Thank-を変更した場合あなたを助けてくれたすべての人にあなたをお迎えください。おそらく私自身の不適法のために、私は上記の答えを得ることができませんでしたので、より単純なオプションに行きました...

スパンの内容に基づいて背景画像を変更するのではなく、

マーク