SlideToggle não funciona

[Wagner Antonelli Filgueiras 0]

Olá,  criei o seguinte código para que ao clicar nas palavras "leia mais" seja apresentado o conteúdo escondido.

Mas não está funcionando como esperado, apenas escondi o conteúdo.

 

 Podem me ajudar a achar o que estou fazendo errado?

 

[Código abaixo]

 

<script>
$('.more').click(function(){
   $('.oculta').slideToggle(); 
});
</script>

 

<style type="text/css">
.oculta { display:none; }
</style>

 

<h3>Lorem ipsum dolor sit amet.</h3></br>

<a href="#" class="more">Leia mais</a><br />

 

<div class="oculta">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nemo architecto voluptatum asperiores nam natus hic earum ratione quae reprehenderit labore necessitatibus explicabo veritatis ipsam expedita laudantium qui maiores laboriosam inventore?</div>

[GabrielFerrari 41]

Como você está setando a função do click no começo do arquivo, o elemento HTML ainda não existe.

 

Adicione o seguinte código:

 

$(document).ready(function(){
    $('.more').click(function(){
       $('.oculta').slideToggle();
    });
});

 

o $( document ).ready() vai basicamente aguardar concluir o carregamento da página para depois executar seu código.
https://learn.jquery.com/using-jquery-core/document-ready/

[Wagner Antonelli Filgueiras 0]

Funcionou, depois que publiquei em produção deu certo!

 

Muito obrigado Gabriel.