How to create multiple Load More buttons on a page (WordPress)

Question

I have experimented with some plugins and some tutorials, but most tutorial available deal with infinite load, adaptations of the Ajax Load more button, or are not relevant to WordPress sites, and even these are not very useful to the question.

What I hope to achieve is a set of rows with Load More buttons. For example:

ROW 1 (3 posts from Cat=1)

[Load More]

ROW 2 (3 posts from Cat=2)

[Load More]

where each Load More press loads 6 more from that Category.

The code I have for the 3 post rows is:

   <div class="container">
      <?php $posts = get_posts( "cat=1&numberposts=3" ); ?>
      <?php if( $posts ) : ?>
      <?php foreach( $posts as $post ) : setup_postdata( $post ); ?>
      <?php $column = ($column == '') ? 'first' : (($column == 'first') ? 'middle' : (($column == 'middle') ? 'last' : 'first' )); ?>
      <div class="post <?php echo $column; ?>" id="post-<?php the_ID(); ?>" >
         <a href="<?php echo get_permalink($post->ID); ?>" >
         <h3><?php echo $post->post_title; ?></a></h3>
         <?php if ( has_post_thumbnail()) : the_post_thumbnail('columner-thumb'); endif; ?>
      </div>
      <?php endforeach; ?>
      <?php endif; ?>
   </div>

Is there a way to add into this code a Load More button to display more from the category?

Thank you for any help on this javascript question.