Javascript - botão mais produtos

Agradeceria ajuda. Estou tentando fazer com que o botão “mostre mais produtos” funcione mas não estou conseguindo. Poderiam verificar meu código e me corrigir se possível?

> <script type="text/javascript">
>       $(function() {
>       $("#successBtn").click(function(){
>         $("#produtos").fadeIn();
>        });
>        });
> </script>

<div class="col-md-3 col-md-offset-4" >                      
                                  <button rel="tooltip" title="Abrindo..." class="btn btn-default btn-round" id="successBtn" data-toggle="morphing" data-rotation-color="red" >Mais Produtos...
                                   </button>
                                  </div>
                                   
                                <div class="col-md-4"  style="display:none" id="produtos">
                                 <?php 
                                $dao=new produtoDAO($conexao);
                                $produtos = $dao->listaProdutos();
                                foreach($produtos as $produto) : 
                                  ?>
                                
                                <div class="card card-product card-plain">
                                 
                                    <div class="image">
                                        <a href="precompra.php?id=<?=$produto->getId()?>">
                                    <img src="../cadastro/fotos/<?=$produto->getFoto() ?>" alt="foto"/>
                                </a>
                                    </div>

                                    <div class="content">
                                        <a href="#">
                                            <h4 class="title"><?=$produto->getMarca()->getNome() ?></h4>
                                        </a>
                                        <p class="description">
                                          <?=$produto->getDescricao() ?>
                                        </p>
                                        <div class="footer">
                                            <span class="price"> R&dollar;<?=$produto->getPreco() ?></span>                     
                                        </div>
                                     
                                    <</div> <!-- end card -->
                                      
                                  
                                     
                               
                             </div><!-- col-md-4 -->
                            
                                 <?php endforeach?>
                            
                             </div>
                        </div><!-- row -->
                    </div><!-- col-md-9 -->

Sergio boa noite.

Testei no codepen seu código e foi de boa.

Se chamou o Jquery certo no teu código.?

Esse dai ta sem o PHP mas de resto é teu código todo[quote=“Sergio_Guerjik, post:1, topic:350259”]
<</div> <!-- end card -->
[/quote]

Nesse pedaço retirei o < acho que estava sobrando.

Obrigado Leandro eu acredito que o problema possa estar no Jquery mesmo e eu achei que o código estava certo mas o botão não está funcionando e eu não estou conseguindo consertar isso. Vc pode me ajudar a encontrar o meu erro?