Add ctools processing for content loaded via ajax I have a search result page where all the searched results are loaded using ajax call. For each result, there is a button which should open a form in the modal.

The code snippet which is loading a button on the search result is as follows:

$build[$entity-&gt;id]['footer']['footer-bottom-section']['view-modal-form'] = array(
        '#type' =&gt; 'markup',
        '#markup' =&gt; l('&lt;span class="glyphicon glyphicon-ok"&gt;&lt;/span&gt; Get Best Price', 'request/add/'.$space_id.'/'.$entity-&gt;id, array('html'=&gt;TRUE,'attributes'=&gt; array('class'=&gt;array('btn','btn-orange', 'pull-right', 'ctools-use-modal')))),
    );


The button is loaded properly on each search result, and it has all the classes provided. But it does not have ctools-use-modal-processed class. 

I know the reason since the page is already loaded and results are added to the page through ajax after load finishes, ctools is not finding ctools-use-modal class to process. 

I would like to know, how can I trigger ctools to process my ajax loaded search results so that it can add modal form for each searched result? 

EDIT: Following is the js function which is calls a custom menu callback function, to load results:

function fetchNext(url, $parent) {
    $parent.append('&lt;div id="space-loading"&gt;&lt;span class="glyphicon glyphicon-refresh loading-spin" aria-hidden="true"&gt;&lt;/span&gt;Loading&lt;/div&gt;');
    $.get( url, function( data ) {
        $parent.append( data );
        $('.load-next').bind('inview', function (event, visible) {
            if (visible &amp;&amp; !($(this).hasClass('disabled'))) {
                var url = $(this).attr('href');
                fetchNext(url, $(this).parent());
                $(this).remove();
              }
            });
        $('.load-next').click(function (event) {
            event.preventDefault();
            var url = $(this).attr('href');
            fetchNext(url, $(this).parent());
            $(this).remove();
        });
        processAfterLoad();
    }).fail(function() {
        $('#space-loading').text('Error in loading spaces. Please refresh page');
    });
}


This is line which calls above function:

$('.load-next').bind('inview', function (event, visible) {
            if (visible &amp;&amp; !($(this).hasClass('disabled'))) {
                var url = $(this).attr('href');
                fetchNext(url, $(this).parent());
                $(this).remove();
              }
            });


Following is the kind of URL which will be called:

/lazyspaces/&lt;Google places api locality&gt;?&lt;lat, lng, geolocation, sort, page&gt;


for e.g.:

/lazyspaces/Thane-West--Thane--Maharashtra--India?lat=19.2444738&amp;lng=72.9814877&amp;geolocation=Thane%20West%2C%20Thane%2C%20Maharashtra%2C%20India&amp;sort=distance&amp;page=2&amp;plain=1&amp;lastdistance=8.80


Menu callback:

$items['lazyspaces'] = array(
        'title' =&gt; 'Find a Space',
        'page callback' =&gt; 'discover_lazy_spaces',
        'access callback' =&gt; 'entity_access',
        'access arguments' =&gt; array('view', 'space', 1),
        'file' =&gt; 'includes/search.utils.inc',
);


Here discover_lazy_spaces function, extracts get parameters and send it to a query to fetch results from database and then builds result list.
You need to call Drupal.attachBehaviors() after inserting the new content into the page. 

Change this:

$parent.append( data );


To this:

$parent.append( data );
Drupal.attachBehaviors($parent);