Streaming live at 10am (PST)

How do I re initiate tabs after loading content with ajax


#1

I am working on a website that has a list of vehicles on a listing page. Each has a more info button that loads a full screen panel and fetches the content from the individual vehicle pages without loading it.

Using ajax to load the content from another page into a div on the current page.

Here is the code

$('.vechicle-info').click(function(e) {
    	e.preventDefault();
    	$('.vehicle-ajax-details').hide();
    	$('.loading-content-wrap').show();
    	var loadFromUrl = $(this).attr('href')
    	setTimeout(function() {
    		$('.vehicle-ajax-details').load(loadFromUrl+' .vehicle-details-content', function() {
    		    $('.vehicle-ajax-details').fadeIn(3000);
    		    $('.loading-content-wrap').hide();
    		});
    	}, 1600)
    });

The single page content/html being pulled in contains a set of webflow tabs. On the vehicle page the tabs work. But when the tabs are loaded using the ajax code the tabs do not work.

Is there a way with Javascript to re initiate the tabs after the ajax content is loaded so they will work?


#2