title: Text-transform doesn't work when I try to get the value
body: <p>I have a textbox with "text-transform: capitalize;" and it works fine, but when I try to get it's value it's not transformed. For example I write in "test" and it shows "Test" in the textbox, but when I do "console.log("document.getElementById("search").value")" it displays "test".<br>
  How can I fix this?</p>
  
  <p>Here is my code :</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;input type="text" id="search"/&gt;
  &lt;button type="submit" onclick="query()"&gt;Submit&lt;/button&gt;
  &lt;div class="query-div"&gt;&lt;p class="query-p"&gt;Test-a&lt;/p&gt;&lt;/div&gt;
  &lt;div class="query-div"&gt;&lt;p class="query-p"&gt;Test-b&lt;/p&gt;&lt;/div&gt;
  &lt;div class="query-div"&gt;&lt;p class="query-p"&gt;Test-ba&lt;/p&gt;&lt;/div&gt;
  </code></pre>
  
  <p>Javascript:</p>
  
  <pre><code>function query() {
  var x = document.querySelectorAll(".query-p");
  var y = document.getElementById("search");
  var i;
          for(i = 0; i &lt; x.length; i++) {
          if(x[i].innerHTML.includes(y.value)) {x[i].style.display = 'block';} else {x[i].style.display = 'none';}
               console.log(x[i].innerHTML);
      }
  }
  </code></pre>