title: How can I use "onchange" to get immediate response?
body: <p>I'd like to make visible the event, event.target objects and  show immediately how event.target.value changes when I type in an input field.</p>
  <p>My code works but it only shows the things when I click next to the input field.</p>
  <p>Is it possible to show the value of event.target.value property as I am typing in?</p>
  <p>(Here is the full version:
  <a href="https://codepen.io/parragiWeb/pen/mdPREoB" rel="nofollow noreferrer">https://codepen.io/parragiWeb/pen/mdPREoB</a>)</p>
  <p>Here is part of it:</p>
  <p>HTML: <code>&lt;input id=&quot;elem&quot; type=&quot;text&quot;&gt;&lt;/input&gt;</code></p>
  <p>JS:</p>
  <pre><code>elem.onchange = (event) =&gt; {
    for(let key in event) {
      output.innerHTML += &quot;&lt;p&gt;&quot; + key + &quot;: &quot; +  event[key] +&quot;&lt;/p&gt;&quot;;
    }
    
    for(let key in event.target) {
      output2.innerHTML += &quot;&lt;p&gt;&quot; + key + &quot;: &quot; +  event[key]  + &quot;&lt;/p&gt;&quot;;
    }
    
    output3.innerHTML += &quot;&lt;p&gt;&quot; + event.target.value + &quot;&lt;/p&gt;&quot;;
  }
  </code></pre>