Вопрос по jquery, javascript – не уверен насчет метода .on ()

Я использовал$.click() метод для запуска некоторых событий. Но затем мне нужно было установить некоторые события для некоторых элементов HTML, прежде чем элементы были объявлены. Давайте возьмем это в качестве примера:

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

Недостатком является то, что при настройке.click() метод,div.hide элементы не существуют, поэтому триггер не установлен.

Поэтому я обратился к.on() метод, вот так:

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

Но это также не работает. Я думал звоню.on() сделает все существующее и будущееdiv.hide элементы вызывают'click' function().

Мне удалось преодолеть это неудобство, но, насколько я знаю, мне бы хотелось узнать, что я делаю неправильно. Нет ли способа назначить триггер для будущих элементов HTML?

Моим решением было:

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