Add filter-class in <svg>, not in <img>

    .check{
        filter: invert(24%) sepia(100%) saturate(1648%) hue-rotate(96deg) brightness(97%) contrast(105%);
    }

<svg class='check'  height="24" viewBox="0 0 24 24" width="24">
<path d="M0 0h24v24H0z" fill="none"/><path d="M9 16.2L4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4L9 16.2z"/>
</svg>

Get this:

I have tried to change the color of SVG to green.

First, I tried to use fill, but it only changes the background.

<svg  height="24" viewBox="0 0 24 24" width="24">
<path d="M0 0h24v24H0z" fill="green"/><path d="M9 16.2L4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4L9 16.2z"/>
</svg>

Also I have tried this answer

<style>
    img .check{
        filter: invert(24%) sepia(100%) saturate(1648%) hue-rotate(96deg) brightness(97%) contrast(105%);
    }
    
</style>
<img class="check" src="check.svg">

However, It doesn’t work too.
Hope for your help 🙂