Simple Javascript Carousel

Include Before </head>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>


Add in Body

<script>
var arrryDish = ["Barbecue", "biryani", "Burgers", "Cafes", "Chicken", "Chinese",
"Desserts", "Food-Drink", "French", "Indian", "Pizza", "Sandwiches", "Barbecue",
"biryani", "Burgers", "Cafes", "Chicken", "Chinese", "Desserts", "Food-Drink", "French",
"Indian", "Pizza", "Sandwiches"];

$(document).ready(function(){
var lengthDish = arrryDish.length;
for(var i = 0; i < lengthDish; i++){
$(".icon1").append("<a class='aDish' href='#'><i class='hita' style=background-image:url('images/" + arrryDish[i] + ".png');></i><div>" + arrryDish[i] + "</div></a>");
}
});

function openNav() {
if(document.getElementById("mySidenav").style.width == "300px"){
closeNav();
} else {
document.getElementById("mySidenav").style.width = "300px";
}
}

function closeNav() {
    document.getElementById("mySidenav").style.width = "0px";
}
function openCartNav() {
if(document.getElementById("myCartSideNav").style.width == "300px"){
closeCartNav();
} else {
document.getElementById("myCartSideNav").style.width = "300px";
}
}

function closeCartNav() {
document.getElementById("myCartSideNav").style.width = "0px";
}
$(window).scroll(function() {
    closeNav();
//closeCartNav();
});


//Hide left at start
$('.leftArrow').hide();
$('.leftArrow').click(function() {
  event.preventDefault();
if($('.icon1').scrollLeft() <= 0 )
    {$('.leftArrow').hide()}
        $('.rightArrow').show(); 
$(".icon1").animate({scrollLeft: "-=400px"})
});

$('.rightArrow').click(function() {
  event.preventDefault();
if ($('.icon1')[0].scrollWidth - $('.icon1').scrollLeft() <= $('.container').width())
    {$(".rightArrow").hide()}
  $('.leftArrow').show();
  $(".icon1").animate({scrollLeft: "+=400px"})
});



// <!-- javascript for restaurantsc detail -->
$(window).scroll(function() {
    closeNav();
//closeCartNav();
});

function openNav() {
if(document.getElementById("mySidenav").style.width == "300px"){
closeNav();
} else {
document.getElementById("mySidenav").style.width = "300px";
}
}

function closeNav() {
    document.getElementById("mySidenav").style.width = "0px";
}
function openCartNav() {
// if(document.getElementById("myCartSideNav").style.width == "300px"){
// closeCartNav();
// } else {
// document.getElementById("myCartSideNav").style.width = "300px";
// }
}

function closeCartNav() {
    //document.getElementById("myCartSideNav").style.width = "0px";
}

$( ".foodCustom" ).click(function() {
  $( ".customizePopup" ).css("display", "block");
});




$('.rightArrowMenu').click(function() {
  event.preventDefault();
  $('.navMenuItem').animate({
    scrollLeft: "+=200px"
  }, "fast");
});

 $('.leftArrowMenu').click(function() {
  event.preventDefault();
  $('.navMenuItem').animate({
    scrollLeft: "-=200px"
  }, "fast");
});
// <!-- javascript for restaurantsc detail end-->
</script>