content a textarea shows in a div

Question

i want to make a textarea to show its content to a div by a clicking a button. i wrote a simple code that it sees for short time in div but it disappears in div i wrote it in JSFiddle and it has problem there too!! i don't know what's the problem

please see my code and help me

my code link: jsfiddle

<textarea class="inBox"></textarea><button class="btn">send</button>

$(document).ready(function(){
    $('.btn').on('click',function(){
    var inpx= $('.inBox').val();
    $('#mainbox').append('<p>'+inpx+'</p>');
     $('.inBox').val("");   
    });

});

Answer 1

Your code is right to do what you want but on your fiddle you forgot to include jquery, top left.

$(document).ready(function(){
 $('.btn').on('click',function(){
     var inpx= $('.inBox').val();
        $('#mainbox').append('<p>'+inpx+'</p>');
         $('.inBox').val("");   
 });
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<textarea class="inBox"></textarea><button class="btn">send</button>

<div id="mainbox"></div>