How to change <div>'s width by user input using jQuery/JavaScript? -


so, here problem: have div:

<div id="square"></div> 

and input:

<input type="number" id="width"> 

and script:

var x;         $("button").click(function(){             x = $("#width").val();             $("#square").attr("width", x);         } 

what want when user enters number inside input, , clicks button, div's width set number inside input. thanks! p.s. sorry bad english.

check out fiddle. need use .css() change style of element.

here snippet.

var x;  $("button").click(function() {    x = $("#width").val();    $("#square").css("width", x);  });
#square {    position: absolute;    width: 20px;    height: 20px;    background: red;  }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <div id="square"></div>  <br>  <br>  <input type="number" id="width" />  <button>click</button>


Comments