現在のページリンクの色を変える

Question

###前提・実現したいこと
現在いるページのリンクの色を変えたいです。

###発生している問題
aタグの中に、文字とimgタグを入れています。文字は色が変わりますが、画像は変わりません。
バリデーションのエラーはありません。

###該当のソースコード

<nav id="nav">
<ul><li>
                   <a href="index.html">
                        <img src="img/icon01.png" alt="ホーム">ホーム
                    </a>
</li></ul>
</nav>

#nav ul li a.on {
    filter: brightness(100);
}
#nav ul li a img.on {
    filter: brightness(100);
}

$(function(){
            var url = $(location).attr('href');
            var url_sp = url.split("/");
            var file = url_sp[url_sp.length - 1];
            $('#nav').find('a,img').each(function(){
                var link = $(this).attr('href');
                if(link == file){
                    $(this).addClass('on');
                }
            });
        });

JSに詳しくないのでよくわからず、上のように.findの部分に「img」を付け足しましたが、ダメなようです。。
知識のある方、ぜひ回答よろしくお願いします。

Comments

[coco_bauer]

質問のタイトルは「現在のページリンクの色を変える」で、内容には「文字は色が変わりますが、画像は変わりません」と書かれています。　何を、どのように変えたいのですか？

[sascha]

コメントありがとうございます。解決しました。ご協力ありがとうございました。

Answer 1

#nav ul li a.on img {
    filter: brightness(100);
}

Comments

[sascha]

早速の回答ありがとうございます。
解決しました。
CSSの問題だったんですね...