html - jQuery Text box not showing -

i trying show text box when 1 click on click me button check here

when user click on "click me" button want display area colored box.

here code.

html

<h1>welcome quickschools</h1>   <div id="section" style="display:none;">here new section</div> <div>lorem ipsum dummy text of printing , typesetting</div> <button type="button" id="btn">click me</button> 

css

#section{ background-color:red; margin-left: 363px; width: 200px; height: 150px; margin-top: -61px} 

jquery

$( "button" ).click(function() { $("#section").show();}); 

can 1 ?

here jsfiddle: http://jsfiddle.net/nz7z9dtu/

please see jsfiddle -http://jsfiddle.net/nz7z9dtu/9/

in order achieve looking - prntscr.com/6tpi12 - should decrease width of 'content' class div on click displaying 'section' class. jquery should follows:

$( "button" ).click(function() {     $(".section").show();     $(".content").css("width", "70%") });