Как задать отдельные стили только для браузера IE 11 и Edge

Задача такая, для IE11 и Edge задать отдельные стили для SVG, потому что в этих браузерах не поддерживаются фильтры для свг и соответственно свг-шка не отображается как положено (или вообще не отображается).

В общем, все известные мне способы из интернета, как задетектить IE, не сработали или сработали не так как ожидалось, пробовал и эти варианты, и многие другие:

@media screen and (min-width:0\0) { }
@media all and (-ms-high-contrast: none) { }
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { }
@supports (-webkit-appearance: none) { }

Поэтому пришлось прибегнуть к старому доброму определению браузера IE с помощью JS:

var isIE = '-ms-scroll-limit' in document.documentElement.style && '-ms-ime-align' in document.documentElement.style;

Если isIE равно true, значит можем навесить на любой элемент класс .ie-support, в моем примере, для меня лучше навесить данный класс на body, потому как потом можно обратиться к любому элементу внутри body:

if (isIE) {
  $('body').addClass('ie-support');
}

И уже в стилях можем задать любые нужные правила для элементов, если страница открыта в браузере IE:

.ie-support svg path {
  filter: none;
}

Данные правила сработают только в браузере IE11 или Edge.