I added carousel images dynamically in the div using Jquery, but images sliding is not working... please find the below code ...
please help me out
$("#addPrivateTravel").append("<div class='col-md-4'><div class='card mb-4'><div class='view overlay' id='" + obj.name + "_"+obj.id+"' name='" + obj.id + "' onclick='getPrivateToureDetails1(this)'><div id='carousel-example-" + obj.id + "' class='carousel slide carousel-fade' data-ride='carousel'><ol class='carousel-indicators'><li data-target='#carousel-example-" + obj.id + "' data-slide-to='0' class='active'></li><li data-target='#carousel-example-" + obj.id + "' data-slide-to='1'></li><li data-target='#carousel-example-" + obj.id + "' data-slide-to='2'></li></ol><div class='carousel-inner' role='listbox'><div class='carousel-item active'><img class='card-img-top' src='./img/groupTravelImages/"+(name).toLowerCase()+"/landingSlidersImages/image_1.jpg' alt='Card image cap'></div><div class='carousel-item'><img class='card-img-top' src='./img/groupTravelImages/"+(name).toLowerCase()+"/landingSlidersImages/image_2.jpg' alt='Card image cap'></div><div class='carousel-item'><img class='card-img-top' src='./img/groupTravelImages/"+(name).toLowerCase()+"/landingSlidersImages/image_3.jpg' alt='Card image cap'></div></div></div><a href='#!'><div class='mask rgba-white-slight'></div></a></div><div class='card-body text-left'><h4 class='card-title text-capitalize'>" + obj.name + "</h4><hr/><div class='tourPlaceDetails'><div class='tourPlaceDetailsInnerDivs1' style='text-align: center'><div></div></div></div><button type='button' id='" + obj.name + "' name='" + obj.id + "' class='btn btn-light-blue btn-sm pull-right active' onclick='getPrivateToureDetails(this)'>Know more</button></div></div></div>")
$('.carousel').carousel({
interval:5000
})