Javascript-форум - Открывается меню при клике на любой файл SVG

На странице расположены три svg картинки. 1.Меню (menu.svg). 2.Рисунок (geography.svg) и 3. Рисунок (fullmap.svg). Обнаружил что при нажатии на 2-й и 3-й тоже срабатывает открытие меню, что должно происходить только при клике на меню. Менял названия в скрипте и html, ковыряю 3-й день этот код не могу найти где подвох.

<!DOCTYPE html>
<html>
        
        <head>
                <meta charset="UTF-8">
                <title>
                        Название
                </title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
<link rel="stylesheet" type="text/css" href="css/style.css">
        </head>
        
        <body>
                <div class="container" >
<div class="mobile_menu_block""><img src="img/icon/menu.svg" class="ham hamRotate"  onclick="this.classList.toggle('active')"alt="mobile_botton">
					</div>
					<div class="overlay">
<ul>
<li><a href="index.html">- ВЕРНУТЬСЯ -</a></li>
<li><a href="">- ЧАСТЫЕ ВОПРОСЫ -</a></li>
<li><a href="">- УЗНАЙ СТОИМОСТЬ -</a></li>
<li><a href="tel:+792665432109">+7 (926) 654-321-09</a></li>
</ul>	
</div>
                        <!-- Panels -->
<div class="swipe">
<div class="panel" data-img="http://payload100.cargocollective.com/1/9/296422/4317770/2-%20Arquitectura%205_o.jpg">
                                </div>
<div class="panel" data-img="http://payload100.cargocollective.com/1/9/296422/4317770/3%20-%20Interiores%201_o.jpg">
                                </div>
<div class="panel" data-img="https://a.radikal.ru/a08/2003/c7/c85d654e7fee.jpg">
<div class="map"><img src="img/fullmap.svg">
                                        </div>
<div class="geography"><img src="img/geography.svg">
                                        </div>
<div class="vulcan">
<div class="fog_1"></div>
<div class="fog_2"></div>
<div class="fog_3"></div>
                                        </div>
                                </div>
<div class="panel" data-img="http://payload100.cargocollective.com/1/9/296422/4317770/2-%20Arquitectura%205_o.jpg">
                                </div>
<div class="panel" data-img="http://payload100.cargocollective.com/1/9/296422/4317770/3%20-%20Interiores%201_o.jpg">
                                </div>
                        </div>
<div class="info">
<div class="buttons"><button class="btn-prev"><p class="btn_prev">
                                                        <b>
                                                                W
                                                        </b>
                                                </p>
                                        </button>
<button class="btn-next"><p class="btn_next">
                                                        <b>
                                                                E
                                                        </b>
                                                </p>
                                        </button>
                                </div>
                        </div>
                </div>
                
                
<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js'>
                </script>
<script src="js/index.js"></script>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js">
                </script>

<script src="js/main.js"></script>
<script src="js/menu.js"></script>
<script src="js/modernizr.js"></script>
<script src="js/jquery-2.1.1.js"></script>
        </body>
</html>

const $icon = $('img');
const $menu = $('.overlay');

$icon.on('click', function(){
  if(!$menu.hasClass('active')) {
 		$menu.fadeIn().toggleClass('active');
  } else {
    $menu.fadeOut().removeClass('active');
  }
});

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Название</title> <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"> <link rel="stylesheet" type="text/css" href="css/style.css"> </head> <body> <div class="container"> <div class="mobile_menu_block"><img src="img/icon/menu.svg" class="ham hamRotate" onclick= "this.classList.toggle('active')" alt="mobile_botton"></div> <div class="overlay"> <ul> <li> <a href="index.html">- ВЕРНУТЬСЯ -</a> </li> <li> <a href="">- ЧАСТЫЕ ВОПРОСЫ -</a> </li> <li> <a href="">- УЗНАЙ СТОИМОСТЬ -</a> </li> <li> <a href="tel:+792665432109">+7 (926) 654-321-09</a> </li> </ul> </div> <div class="swipe"> <div class="panel" data-img= "http://payload100.cargocollective.com/1/9/296422/4317770/2-%20Arquitectura%205_o.jpg"></div> <div class="panel" data-img= "http://payload100.cargocollective.com/1/9/296422/4317770/3%20-%20Interiores%201_o.jpg"> </div> <div class="panel" data-img="https://a.radikal.ru/a08/2003/c7/c85d654e7fee.jpg"> <div class="map"><img src="img/fullmap.svg"></div> <div class="geography"><img src="img/geography.svg"></div> <div class="vulcan"> <div class="fog_1"></div> <div class="fog_2"></div> <div class="fog_3"></div> </div> </div> <div class="panel" data-img= "http://payload100.cargocollective.com/1/9/296422/4317770/2-%20Arquitectura%205_o.jpg"></div> <div class="panel" data-img= "http://payload100.cargocollective.com/1/9/296422/4317770/3%20-%20Interiores%201_o.jpg"> </div> </div> <div class="info"> <div class="buttons"> <p class="btn_prev"><button class="btn-prev"><b>W</b></button></p> <p class="btn_next"><button class="btn-next"><b>E</b></button></p> </div> </div> </div> <script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js'></script> <script> $(function() { const $icon = $('.mobile_menu_block'); const $menu = $('.overlay').addClass('active'); $icon.on('click', function(){ $menu.stop().fadeToggle().toggleClass('active'); }); }); </script> </body> </html>