How to move 1st textarea content to 2nd textarea on button click P(paragraph). on button click p it should add as paragraph in 2nd textarea. How to achieve this in javascript or jquery? How to create custom texteditor with inline edit and delete button, here the inline edit is for 2nd textarea content.
$('#paragraph').on('click', function() {
var first_para_text = $('#first_textarea').val();
$('#second_textarea').val(first_para_text);
$('#second_textarea').prop('disabled', true);
});
$('#edit').on('click', function() {
$('#second_textarea').prop('disabled', false);
});
$('#reset').on('click', function() {
$('#second_textarea').val('');
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="col-md-12">
<div class="col-md-6">
<label>first text area</label>
<textarea id="first_textarea"></textarea>
</div>
<div class="col-md-6">
<label>second text area</label>
<textarea id="second_textarea" disabled></textarea>
<button id="edit">
Edit
</button>
<button id="reset">
Reset
</button>
</div>
<hr>
<button id="paragraph">
Transfer Text
</button>
</div>