title: Why Jquery is'nt working with a textarea?
body: <p>I'm working on a laravel project, and I'm trying to make a real time preview (iMessage phone conversation like) with Jquery.</p>
  
  <p>I want my textarea value to be displayed in a p flag (the message) in the conversation.</p>
  
  <p>textarea
  <img src="https://i.stack.imgur.com/ymAZz.png" /></p>
  
  <p>phone conversation</p>
  
  <p><img src="https://i.stack.imgur.com/2ixrY.png"/></p>
  
  <p>I used this code:</p>
  
  <pre><code>$('#modele_message').on('input', function(e) {
      $("#messagerendu").html($(this).val());
  });
  </code></pre>
  
  <p>Where <strong>#modele_message</strong> is my <strong>textarea</strong>, and <strong>#messagrendu</strong> the <strong>p flag that we can see on the screen</strong>.</p>
  
  <p>It's not working, I don't know why...</p>
  
  <p>My blade page code :</p>
  
  <pre><code>&lt;div class="row"&gt;
  &lt;div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12"&gt;
      &lt;div class="card"&gt;
          &lt;h5 class="card-header"&gt;Modifier le modèle &lt;b&gt;{{ $modele-&gt;title }}&lt;/b&gt;&lt;/h5&gt;
          &lt;div class="card-body"&gt;
              @if ($errors-&gt;any())
                  &lt;div class="alert alert-danger"&gt;
                    &lt;ul&gt;
                        @foreach ($errors-&gt;all() as $error)
                          &lt;li&gt;{{ $error }}&lt;/li&gt;
                        @endforeach
                    &lt;/ul&gt;
                  &lt;/div&gt;&lt;br /&gt;
              @endif
              &lt;form method="post" action="{{ route('modeles.update', $modele-&gt;id) }}"&gt;
                      &lt;div class="form-group"&gt;
                          @csrf
                          @method('PATCH')
                          &lt;label for="title"&gt;Titre du modèle :&lt;/label&gt;
                          &lt;input type="text" class="form-control" name="title" value="{{$modele-&gt;title}}"/&gt;
                      &lt;/div&gt;
                      &lt;div class="form-group"&gt;
                          &lt;label for="message"&gt;Message du modèle :&lt;/label&gt;
                          &lt;textarea class="form-control" name="message" id="modele_message"&gt;{{$modele-&gt;message}}&lt;/textarea&gt;
                      &lt;/div&gt;
                      &lt;div class="form-group"&gt;
                          &lt;label for="campagne_id"&gt;Campagne&lt;/label&gt;
                          &lt;select class="form-control" id="input-select" name="campagne_id" required&gt;
                              @foreach ($campagnes as $campagne)
                                  &lt;option value="{{$campagne-&gt;id}}"&gt;{{$campagne-&gt;name}}&lt;/option&gt;
                              @endforeach    
                          &lt;/select&gt;
                      &lt;/div&gt;
                      &lt;button type="submit" class="btn btn-primary"&gt;Mettre à jour&lt;/button&gt;
              &lt;/form&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  
  &lt;div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12"&gt;
      &lt;div class="card"&gt;
          &lt;h5 class="card-header"&gt;Prévisualisation&lt;/b&gt;&lt;/h5&gt;
          &lt;div class="card-body"&gt;
                  &lt;div class="panel panel-default" style="margin: 0 auto"&gt;
                          &lt;div class="panel-heading text-center"&gt;
                              &lt;div class="row"&gt;
                                  &lt;div class="col-md-2"&gt;
                                      &lt;div class="icon"&gt;&lt;i class="fas fa-chevron-left"&gt;&lt;/i&gt;&lt;/div&gt;
                                  &lt;/div&gt;
                                  &lt;div class="col-md-offset-3 col-md-2" style="margin: 0 auto"&gt;
                                      &lt;div id="contact"&gt;&lt;span class="fas fa-user" aria-hidden="true"&gt;&lt;/span&gt;&lt;/div&gt;
                                      GRDF
                                  &lt;/div&gt;
                                  &lt;div class="col-md-offset-3 col-md-2"&gt;
                                      &lt;div class="icon"&gt;&lt;i class="fas fa-info-circle"&gt;&lt;/i&gt;&lt;/div&gt;
                                  &lt;/div&gt;
                              &lt;/div&gt;
                          &lt;/div&gt;
                          &lt;div class="panel-body"&gt;
                              &lt;div class="date"&gt;
                                  &lt;span class="bold"&gt;Aujourd'hui&lt;/span&gt; 12:00
                              &lt;/div&gt;
                              &lt;div class="invisible message"&gt;
                                  &lt;div class="message-in message-default"&gt;
                                      Test
                                  &lt;/div&gt;
                              &lt;/div&gt;
                              &lt;div class="invisible message"&gt;
                                  &lt;div class="message-in message-default"&gt;
                                      Test
                                  &lt;/div&gt;
                              &lt;/div&gt;
                              &lt;div class="invisible message text-right"&gt;
                                  &lt;div class="message-out message-default"&gt;
                                      Test
                                  &lt;/div&gt;
                              &lt;/div&gt;
                              &lt;div class="invisible message text-right"&gt;
                                  &lt;div class="message-out message-default"&gt;
                                  &lt;/div&gt;
                              &lt;/div&gt;
                              &lt;div class="message"&gt;
                                  &lt;div class="message-in message-default"&gt;
                                      &lt;p id="messagerendu"&gt;&lt;/p&gt;
                                  &lt;/div&gt;
                              &lt;/div&gt;                          
                          &lt;/div&gt;
                      &lt;/div&gt;
  
                      &lt;div class="modal" id="modal-photo"&gt;
                        &lt;div class="modal-dialog"&gt;
                          &lt;div class="modal-content"&gt;
                              &lt;div class="modal-header"&gt;
                                  &lt;button type="button" class="close" data-dismiss="modal"&gt;x&lt;/button&gt;
                                  &lt;h4 class="modal-title"&gt;Envoyer une photo&lt;/h4&gt;
                              &lt;/div&gt;
                              &lt;div class="modal-body"&gt;
                                  &lt;input type="file" name ="photo" id="photo" accept="image/*"&gt;
                              &lt;/div&gt;
                              &lt;div class="modal-footer"&gt;
                                  &lt;button id="validation" class="btn btn-primary"&gt;Envoyer&lt;/button&gt;
                              &lt;/div&gt;
                          &lt;/div&gt;
                        &lt;/div&gt;
                      &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p></p>