[javascript] how to change text box value with jQuery?

_x000D_
_x000D_
function xText() {_x000D_
  var x = $("#input").val();_x000D_
  var x_length = x.length;_x000D_
  var a = '';_x000D_
  for (var i = 0; i < x_length; i++) {_x000D_
    a += "x";_x000D_
  }_x000D_
  $("#output").val(a);_x000D_
}
_x000D_
.form-cus {width: 200px;margin: auto;position: relative;}_x000D_
.form-cus .putval, .form-cus .getval {width: 100%;box-sizing: border-box;}_x000D_
.form-cus .putval {position: absolute;left: 0px;top:0; height:100%; color: transparent;background: transparent;border: 0px;outline: 0 none;}_x000D_
.form-cus .putval::selection {color: transparent;background: lightblue;}
_x000D_
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.1/jquery.min.js"></script>_x000D_
<p>Input Number or Strong Mouse Click is Hidden... </p>_x000D_
<div class="form-cus">_x000D_
  <input class="putval" type="text" id="input" maxlength="16" oninput="xText();" placeholder="Input Text" />_x000D_
  <input class="getval" type="text" id="output" maxlength="16" />_x000D_
</div>
_x000D_
_x000D_
_x000D_