Javascript не работает после использования функции JQuery .load ()

Question

У меня есть простая система корзины, которая показывает все продукты в корзине пользователя. Пользователь может обновить количество этой корзины со страницы корзины.

Когда пользователь обновляет количество, выполняется вызов ajax, который обновляет значение в базе данных, а затем он перезагружает div со всеми обновления отражаются.

Возникают две проблемы: 1. Div по какой-то причине создается снова в том же Div. Я не знаю почему. Таким образом, в этом случае #menuContent создается снова внутри #menuContent так, что:

<div class="row" id="menuContent">
   <div class="row" id="menuContent">
      //php code to display list of items
   <div>
</div>

После этого мой javascript файл перестает работать. У меня есть файл с именем site.js, который содержит все мои функции. Он выполняется при загрузке страницы, но не после .load()

Вот мой код:

<div class="row"  id="menuContent">

    <?php foreach($cartItems as $item): ?>
        <div class="col s12 m12 single-card">
            //Item information here and a button to update the cart. On button click, ajax call makes an update and on success it reloads the #mainContent div
        </div>
    <?php endforeach; ?>
</div>

Это то, что я использую для перезагрузки div:

$("#menuContent").load(location.href + " #menuContent");