Проблемы с подменю Bootstrap NavBar при изменении позиции при клике

Question

Я создал панель навигации с подменю, используя Bootstrap v4.2.1. Наведение OnClick осуществляется через Javascript. Проблема в том, что всякий раз, когда я загружаю страницу и нахожу на элемент подменю, меню открывается, но появляется прямо под элементом. Когда я нажимаю на меню, оно исчезает и появляется в правой части подменю. В идеале, я бы хотел, чтобы подменю отображалось в правой части выпадающего меню, а не появлялось внизу при первом наведении. Я подозреваю, что я мог что-то упустить в своем Javascript, но я могу ошибаться. Любая помощь / совет будет принята с благодарностью. Вот моя скрипка: https://jsfiddle.net/fzev07tb/

//Script to toggle navbar dropdown
$(document).ready(function() {

  $('.navbar .dropdown-item').on('click', function(e) {
    var $el = $(this).children('.dropdown-toggle');
    var $parent = $el.offsetParent(".dropdown-menu");
    $(this).parent("li").toggleClass('open');

    if (!$parent.parent().hasClass('navbar-nav')) {
      if ($parent.hasClass('show')) {
        $parent.removeClass('show');
        $el.next().removeClass('show');
        $el.next().css({
          "top": -999,
          "left": -999
        });
      } else {
        $parent.parent().find('.show').removeClass('show');
        $parent.addClass('show');
        $el.next().addClass('show');
        $el.next().css({
          "top": $el[0].offsetTop,
          "left": $parent.outerWidth() - 4
        });
      }
      e.preventDefault();
      e.stopPropagation();
    }
  });

  $('.navbar .dropdown').on('hidden.bs.dropdown', function() {
    $(this).find('li.dropdown').removeClass('show open');
    $(this).find('ul.dropdown-menu').removeClass('show open');
  });

});

//Script for OnHover OnClick NavBar Item -->
jQuery(function($) {
  if ($(window).width() > 769) {
    $('.navbar .dropdown').hover(function() {
      $(this).find('.dropdown-menu').first().stop(true, true).delay(250).slideDown();

    }, function() {
      $(this).find('.dropdown-menu').first().stop(true, true).delay(100).slideUp();

    });

    $('.navbar .dropdown > a').click(function() {
      location.href = this.href;
    });

  }
});