<H3> Hello from other file </H3>

$(function(){
  $("#div1").load("Navbar.html");
});

<script>
$myHtml = '<nav class="navbar nav-pills navbar-expand-lg navbar-light bg-light shadow sticky-top">\n' +
    '    <a class="navbar-brand" href="#top"><img src="../Images/small_logo4.png" style="width: 50px; height: 40px; margin-right: 20px;"></a>\n' +
    '    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">\n' +
    '    <span class="navbar-toggler-icon"></span>\n' +
    '    </button>\n' +
    '    <div class="collapse navbar-collapse" id="navbarSupportedContent" >\n' +
    '    <ul class="navbar-nav ml-5">\n' +
    '    <li class="nav-item active">\n' +
    '    <a class="nav-link" href="../Homepage.html">Home <span class="sr-only">(current)</span></a>\n' +
    '</li>\n' +
    '<li class="nav-item dropdown">\n' +
    '    <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">\n' +
    '    Shop\n' +
    '    </a>\n' +
    '    <!-- Dropdown Menu -->\n' +
    '    <div class="dropdown-menu mega-menu shadow-lg rounded" aria-labelledby="navbarDropdown">\n' +
    '    <div class="row">\n' +
    '    <!-- Dropdown Items -->\n' +
    '<div class="col-md-3">\n' +
    '    <h6 class="catTopText text-uppercase">Rings</h6>\n' +
    '    <a href="#"><img src="../Images/Rings.jpg" alt="Rings" class="img-fluid"></a>\n' +
    '    </div>\n' +
    '    <div class="col-md-3">\n' +
    '    <h6 class="catTopText text-uppercase">Bracelets</h6>\n' +
    '    <a href="#"><img src="../Images/Bracelets.jpg" alt="Bracelets" class="img-fluid"></a>\n' +
    '    </div>\n' +
    '    <div class="col-md-3">\n' +
    '    <h6 class="catTopText text-uppercase">Necklaces</h6>\n' +
    '    <a href="#"><img src="../Images/Necklaces.jpg" alt="Necklaces" class="img-fluid"></a>\n' +
    '    </div>\n' +
    '    <div class="col-md-3">\n' +
    '    <h6 class="catTopText text-uppercase">Earrings</h6>\n' +
    '    <a href="#"><img src="../Images/Earrings.jpg" alt="Earrings" class="img-fluid"></a>\n' +
    '    </div>\n' +
    '    </div>\n' +
    '    </div>\n' +
    '    </li>\n' +
    '    <li class="nav-item">\n' +
    '    <a class="nav-link active" href="Collection.html">Collection</a>\n' +
    '    </li>\n' +
    '    <li class="nav-item">\n' +
    '    <a class="nav-link" href="#">Contact Us</a>\n' +
    '</li>\n' +
    '</ul>\n' +
    '\n' +
    '<span class="ml-auto" style="color: #66BCFF;">\n' +
    '    <a href="Login.html">My Account</a>\n' +
    '</span>\n' +
    '\n' +
    '<!-- Shopping Cart -->\n' +
    '<span class="ml-4" style="color: #66BCFF;">\n' +
    '    <i class="fas fa-shopping-cart fa-lg"></i>\n' +
    '    </span>\n' +
    '    <button type="button" class="btn btn-link">\n' +
    '    <a href="Pages/shopping-cart/shopping-cart.html">Cart</a>\n' +
    '    <span class="badge badge-danger">3</span>\n' +
    '    <span class="sr-only">Items in cart</span>\n' +
    '    </button>\n' +
    '\n' +
    '    </div>\n' +
    '    </nav>';
$(function(){
  $("#div1").html($myHtml);
});
</script>