how to gather data from different page

Here I have created a filter functionality in which user will select multiple checkbox and based on these selected checkbox ajax will get product data and will show on main page however, my problem is whenever I select collection name it shows only one pages data so could you help me to show multiple pages data based on checkbox selection any help would be appreciated Thanks.

  $('.vendor_filter_item input[type="checkbox"]').click(function(){

    var checkboxes = document.querySelectorAll('.vendor_filter_item input[type="checkbox"]:checked');

    for (var i = 0; i < checkboxes.length; i++) {

      var check_value = checkboxes[i].value;

          $.ajax({
            url:check_value,
            type:'GET',   
            success: function(data) {
              var content =  $('<div>').append(data).find('.collection_all_product #product-grid ');       
            
              if($('.CollectionInner__data').html() == ""){
                $('.CollectionInner__data').html($('.js_inner_product').html());          
              }
              $('.js_inner_product').html("");
              $('.js_inner_product ').append( content );  
              $('.js_inner_product').show();
              $('.collection_all_product').hide();
            }
          }); 
        
     

    }

  });