Hello! I have a connected owl-carusel, I want it to display dynamically added products from the list widget, i.e. so that li is inserted into the div - how can this be done? Code quote

$(".add_to_cart_button").click(function() { $('.cart_list li').each(function() { $('#owl-example').append('<div>' + $(this).html() + '</div>'); }); }); 
 /* Карусель */ <div class="container" id="carousel"> <h3>ДОБАВЛЕННЫЕ БЛЮДА</h3> <div id="owl-example" class="owl-carousel"> <div> <li>Товар 1</li> </div> <div> <li>Товар 2</li> </div> <div> <li>Товар 3</li> </div> <div> <li>Товар 4</li> </div> </div> </div> /* Виджет с корзиной */ <div class="widget_shopping_cart_content"> <ul class="cart_list product_list_widget "></ul> <!-- end product list --> </div> 

  • really nobody knows how? at least tell me how it should look: put the list of ul with li inside the carousel by some condition or vice versa? After all, if li wrap in divs, then the list will not be a list, or am I mistaken? - Vasya

1 answer 1

 $('.cart_list li').each(function(){ $('#owl-example').append('<div>'+$(this).html()+'</div>'); $(this).remove(); }); 

Did this mean?

  • Yes, the essence is this, but something still does not work .. Here, probably, a point is needed between the classes, ".cart_list.product_list_widget li", but it still does not work .. - Vasya
  • No, the point is not needed. I corrected. It was enough to specify one class. I did not notice that there are two classes indicated. I copied it first, as one ... In general, in theory, it will be enough like this: $ ('. Cart_list li') - DES
  • Well, first you need to put your function on triggering when clicking on the "Add to cart" button + you need to create a handler for deletion as well. - Maks Devda
  • @Maks Devda, hung the event on the button, but it somehow works incorrectly - each time it recounts again and the basket is replenished in an arithmetic progression - Vasya
  • one
    @ Vasya hang up $('#owl-example').append('<div>'+$('.cart_list li:last').html()+'</div>'); Sori did not look, there was still html () needed. - Maks Devda