Botão Carregar mais divs

Quero criar um botão que vai carregar uma UL por vez e a cada vez que clica no botão vai carregando mais UL.

minha UL:

<ul id="portfolio-grid" class="thumbnails row">
                        <li class="span4 mix visu">
                            <div class="thumbnail">
                                <img src="images/port/01.png" alt="project 1">
                                <a href="#" class="more show_hide" >
                                </a>
                            </div>
                        </li>
                        <li class="span4 mix web">
                            <div class="thumbnail">
                                 <a href='javascript:;' onclick="abrirForm();">
                                <img src="images/port/02.png" alt="project 2">
                                
                                <div class="mask"></div></a>
                            </div>
                        </li>
</ul>

Meu botão

<div id="rend-more">
            <div id="bt-carregar"><a href="#">
            <h2>CARREGAR</h2><h3>+</h3></a></div>
        </div>