How to load the code from page 2 on page 1 when the button is clicked?

Question

code page1.html:

<script class="scriptthis">
some code
</script>
<div id="content">
<div class="card"></div>
<div class="card"></div>
<div class="card"></div>
<div class="card"></div>
</div>
<button id="load-more">Load More Button</button>
<script>
$( "#load-more" ).click(function() {
  $('script... or near').load('page2.html... script code or script
  $('#content').load('page2.html... content
});
</script>

code page2.html:

<script class="scriptthis">
some code another
</script>
<div id="content">
<div class="card"></div>
<div class="card"></div>
<div class="card"></div>
<div class="card"></div>
</div>

How to load the code from page 2 on page 1 when the button is clicked? Script to script or near - is the main problem. and content to the end #content div

Please help with a working solution.

Answer 1

$.get() api can do it very easily

$.get("url_to_page_2", function(htmlContent, status){
  console.log(htmlContent)
});

this can do the job