Ajaxによるメインループの変更

Ajaxを介して、ユーザーが選択した投稿タイプに応じて記事一覧を変更しようと考えています。

そのためにメインループを変更したいのですが、下記PHPの// メインループ変更でそれが適用されません…

$query->set('post_type', $submitType)として、投稿タイプにAjaxで受け取ったものを使っているつもりなのですが…

どのようにしたらうまいこといくか、どなたか良い方法をご存知でしたら是非教えて下さい。
宜しくお願い致します。

（ちなみにサブループなら下記と同じ流れでajaxが効くのですが、サイトのフロントページで使うためにサブループではいけません。）

▼PHP

// 必要な変数やnonceを最初から出しておく
function my_enqueue_scripts() {
  $handle = 'my-script';
  // Ajaxの呼出しが書かれているスクリプトのパス
  $jsFile = 'path/to/myscript.js';

  wp_register_script($handle, $jsFile, ['jquery']);

  // アクション名
  $acrion = 'my-ajax-action';
  // 配列をJSのオブジェクトに変換したscriptを出力する
  wp_localize_script($handle, 'MY_AJAX', [
    'api'    => admin_url( 'admin-ajax.php' ),
    'action' => $acrion,
    'nonce'  => wp_create_nonce( $acrion ),
  ]);
  /*
  上によってこれが出てくるからJSで使う
  <![CDATA[
  var MY_AJAX = {"api":"http:\/\/example.com\/wp-admin\/admin-ajax.php","action":"my-ajax-action","nonce":"XXXXXXXXXX"};
  ]]>
  */

  wp_enqueue_script($handle);
}
add_action( 'wp_enqueue_scripts', 'my_enqueue_scripts' );

// JSからデータ受け取ってHTML作る
function my_ajax_event() {
  // アクション名
  $action = 'my-ajax-action';

  // nonceのチェック
  if( check_ajax_referer($action, 'nonce', false) ) {
	
    // 選択した投稿タイプ
    $submitType = esc_html( $_POST['submitType'] ); 
 
    // メインループ変更
    function myPreGetPosts( $query ) {
      $paged = get_query_var('paged') ? get_query_var('paged') : 1;
      if ( $query->is_home() ) {
        $query->set('post_type', $submitType);
      }
    }
    add_action('pre_get_posts','myPreGetPosts');

    // 記事を出力
    if ( have_posts() ) :
      while ( have_posts() ) : the_post();
        echo '<h2>'.the_title().'</h2>';
      endwhile;
    if (function_exists('pagination')) {
      $GLOBALS['wp_query']->max_num_pages = max_num_pages;
      $max_num_pages = max_num_pages;
      pagination($max_num_pages);
    }
    wp_reset_postdata();
    else :
      esc_html_e( 'Sorry, no posts matched your criteria.' );
    endif;
		
  } else {
    // エラー
  }
	
  die();
}
add_action( 'wp_ajax_my-ajax-action', 'my_ajax_event' );
add_action( 'wp_ajax_nopriv_my-ajax-action', 'my_ajax_event' );

いちおうご参考にjQueryも載せておきます。（たぶんこちらは問題ないです。）
▼jQuery

"use strict";
(function($){
    $('h2').on('click', function(){    
        var selectedType = $(this).attr('id').split('_')[1];
        $.ajax({
            url: MY_AJAX.api,
            type: 'POST',
            data: {
                // 呼び出すアクション名
                action: MY_AJAX.action,
                // アクションに対応するnonce
                nonce: MY_AJAX.nonce,
                // 渡したいデータ
                submitType: selectedType
            }
        })
        // scusess
        .done(function( response ) {
            $articleOuter = $('#ajaxdayo'); // 表示箇所 
            $response = response; // 返されたデータを変数に格納
            $articleOuter.html(''); // #ajaxdayo内のHTMLを一度削除する
            $articleOuter.html($response); // my_ajax_actionで生成されたデータ（response）を再度挿入する    
            // title変更
            $('h2').removeClass('current');
            $('h2#title_'+selectedType).addClass('current');
            // 現在URL変更
            history.replaceState('','',selectedType);        
            // 履歴追加
            var page = $(self).attr('href');
            history.pushState(null, null, page);
        })
        // error
        .fail(function( jqXHR, textStatus, errorThrown ) {
            alert('error');        
        }); 
    }); 
})(jQuery);