Is there a way to execte jquery event after ajax callback has been completed? Having a simple form with few input fields. 
After clicking on ajax callback submit button, I'm returning the table element. 

Code:

//Hypertension treatment
        $form['hyper_treat'] = array (
      '#type' =&gt; 'radios',
      '#title' =&gt; ('Hypertension treatment:'),                                  
      '#options' =&gt; array(
        'y' =&gt; 'Yes', 
        'n' =&gt; 'No'
      ),
    );


//Hypercholesterolemia
    $form['hyperchol'] = array (
  '#type' =&gt; 'radios',
  '#title' =&gt; ('Hypercholesterolemia:'),                                        
  '#options' =&gt; array(
    'y' =&gt; 'Yes', 
    'n' =&gt; 'No'
  ),
);

//submit button
    $form['action'] = [
    '#prefix' =&gt; '&lt;div id = "ajax_submit"&gt;',
     '#name' =&gt; 'ajax_action',
    '#type' =&gt; 'button',
    '#value' =&gt; $this-&gt;t('Submit'),
    '#ajax' =&gt; [
    'callback' =&gt; '::setMessage',
    'wrapper' =&gt; 'scrollable',
    'method' =&gt; 'replaceWith',
    'effect' =&gt; 'fade', 
    ],
    ];

    //table
    $form['table'] = array(
    '#prefix' =&gt; '&lt;div id="scrollable" class = "col-md-8"&gt;&lt;h4&gt;View Data&lt;/h4&gt;',
        '#type' =&gt; 'tableselect',
         '#suffix' =&gt; '&lt;/div&gt;',
        '#header' =&gt; $header,
         '#options' =&gt; $options,
        '#disabled' =&gt; $disabled,
        '#attributes' =&gt; array('id' =&gt; 'sort-table'),
        '#empty' =&gt; t('Select criteria and search data'),
      );

//callback function
   public function setMessage(array $form, FormStateInterface $form_state) {
  $options = getOptions(); //gets the associative array
  $form['table']['#options'] = $options;
  return $form['table'];
}


I had issues with the pagination and sorting of the table returned using ajax. 
So I thought of using "Datatables" as the alternative option. 

So after the callback, I would want to apply the below jquery to have the table shown as a datatable. 

 $('#sort-table').DataTable( {
        order: [[ 1, 'asc' ]]
    } );


Tried executing the 'mousedown' event for the button but the jquery executes before the ajax callback. 

Is there a possible way to represent the $form['table'] element returned from the ajax callback, as a datatable?

 

Triggering any other event after table returned would display it as a datatable, but I'm looking to have the returned table displayed as a datatable immediately after the $form['table'] is returned. This happens only when the jquery snippet is executed immediately after the table element is returned from the ajax callback function.
You can use custom ajax commands for this. Ajax commands are php classes that correspond to a JS function on the server, which the Drupal JS API calls after Ajax responses.

At a quick lookover, this tutorial looks like it gives a good overview on how to create a custom Ajax command in Drupal 8.