How to edit comment using jQuery?
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<title></title>
</head>
<body>
<script type="text/javascript">
$(function() {
$('.companyInfo').append('<textarea value="save" class="textArea"></textarea>');
$('.companyInfo').append('<button class="saveme">save</button>');
$('.saveme').click(function() {
var text = $('.textArea').val();
$('.newDiv').append('<p><input type="button" class="edit" value="edit">'+text+'</p>');
$('.edit').click(function() {
var result = $(this).parent().text();
var $textarea = $('<textarea class="textArea2"></textarea><button class="save">save</button>');
$textarea.val(result)
$(this).parent().html($textarea);
$('.save').click(function() {
var textInner = $('.textArea2').val();
$(this).parent().parent().html('<p><input type="button" class="edit" value="edit">'+textInner+'</p>');
})
})
})
})
</script>
<div class='companyInfo'></div>
<div class="newDiv"></div>
</body>
</html>
I am trying to create a comment box in which users can add comments, and can edit the comment as much as they need after saving it to the DOM. The above solution works, however, it allows the user to edit the comment only once, so if you try to edit the comment twice, this will not allow you to do this.
I cannot figure out how to make the edit button more than once. Does anyone have an idea how?
+4