não tem certeza sobre o método .on ()

Eu estava usando o$.click() método para acionar alguns eventos. Mas então eu precisava definir alguns eventos para alguns elementos HTML antes dos elementos serem declarados. Vamos pegar isso como um exemplo:

<script>
    $('div.hide').click(function() {
        $('div.hide').css({'display' : 'none'});
     });
</script>
<div class="hide">some text</div>

A desvantagem é que ao definir o.click() método, odiv.hide elementos não existe, portanto, nenhum gatilho está definido.

Então eu virei para o.on() método, assim:

<script>
    $('div.hide').on('click', function() {
        $('div.hide').css({'display' : 'none'});
    });
</script>
<div class="hide">some text</div>

Mas isso também não funciona. Eu pensei em ligar.on() faria todos os existentes e futurosdiv.hide elementos desencadeiam o'click' function().

Consegui superar esse inconveniente, mas, pelo que sei, gostaria de saber o que estava fazendo de errado. Não há como atribuir um gatilho a elementos HTML futuros?

Minha soluçao foi:

<script>
    $(document).ready( function() {
        $('div.hide').click(function() {
            $('div.hide').css({'display' : 'none'});
        });
    });
</script>
<div class="hide">some text</div>

questionAnswers(2)

yourAnswerToTheQuestion