не загружается контент по клику меню с футера, через ajax

Есть ajax, загружаемый контент из сторонних html в контейнер, по клику меню header и footer. Структура меню header'а и меню footer'а абсолютно аналогичны друг-другу, за исключением наименований классов. Проблема в том, что если кликаю на пункты меню header, то контент загружается в контейнер, а если по пунктам меню footer, то нет. Вместо ajax-загрузки открывается новая вкладка, и в ней контент. Как исправить? В чем может быть ошибка? Может структура ajax не правильная? Код приведен.

$(document).ready(function() {

  $(".header_menu a, footer_menu a").click(function() {

    $.ajax({
      url: $(this).attr('href'),
      cache: false,
      success: function(html) {
        $(".content").html(html);
      }
    });
    return false;
  });

});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<ul class="header_menu">
  <li><a class="menu_unit" href="1.html">111</a></li>
  <li><a class="menu_unit" href="2.html">222</a></li>
  <li><a class="menu_unit" href="3.html">333</a></li>
  <li><a class="menu_unit" href="4.html">444</a></li>
</ul>

<ul class="footer_menu">
  <li><a class="footer_menu_unit" href="1.html">111</a></li>
  <li><a class="footer_menu_unit" href="2.html">222</a></li>
  <li><a class="footer_menu_unit" href="3.html">333</a></li>
  <li><a class="footer_menu_unit" href="4.html">444</a></li>
</ul>


Ответы (1 шт):

Автор решения: Igor

Точку перед footer_menu пропустили:

$(".header_menu a, .footer_menu a").click(function(){
    ...
→ Ссылка