inline-search | jQuery inline search plugin | Plugin library

I am trying to modify the select2/AMD example here: https://stackoverflow.com/a/31600521/567736 and I'm not sure whether the issue I'm running into has to do with select2 or whether I am misunderstanding AMD. My code:

On my front page I have my posts set up as 1 post on a row, 2 rows of 2 posts on a row, 1 post on a row, and so on. Then after every 15 posts the load more button appears (example below). The load more button works perfectly, so I am trying to duplicate it on my search page.

I would like to add the same load more button to my search page. However, I have my posts set up differently on this page, I just have 2 posts on each row (there is no alternating col-12 post). In addition to the different loop structure I would like to add the load more button after every 8 posts (example below). I have duplicated the loop structure for my front page in my functions.php, and adjusted it to fit the different loop structure and the load more button after every 8 posts. However, it will not work correctly. The first 8 posts are showing up how I want them, 4 rows of 2 posts per row. But after you press the load more button, the posts show up as they do on my front page loop (15 posts of 1 post on a row, 2 rows of 2 posts on a row, 1 post on a row, and so on).

Does anyone know how I could fix this? Or achieve a search page of 4 rows with 2 posts per row? Thanks in advance.

how my front-page looks

how I want my search page to look

my front-page.php

I am trying to make a customfield search that can be inserted anywhere it should load the results in the same page so i thought ajax would be the trick but it's loading the same page again for some reason here is my search template code: