jQuery append function doesn't work again afte

Question

I have 1 button

<input type="button" id="scrape-button" value="Scrape" />
<textarea id="result" name="result"></textarea>
<textarea id="temp" name="temp" style="display: none;"></textarea>

When I click scrape button first it works

But when I fill something manually on textarea then click scrape button again, $("#result").append($("#temp").val()) function doesn't work again. why?

$(document).ready(function(){
    $("#scrape-button").click(function(){
        var i = 0;
        var start = $("#start").val();
        var num = $("#num").val();
        var pages = $("#pages").val();
        $("#result").val("");
        load(i, pages, start, num);
    });
    function load(i, pages, start, num) {
        if (i < pages){
            url = $("#category").val() + $("#collection").val();
            $("#url").text("h" + url);
            $("#temp").load("coba.php?url=" + encodeURIComponent(url) + "&start=" + start + "&num=" + num, function(){
                if ($("#result").val() != '') $("#result").append("\n");
                $("#result").append($("#temp").val());
                start = parseInt(start) + parseInt(num);
                i++;
                $("#current").text(i + " / " + pages);
                load(i, pages, start, num);
            });
        }
    }
});

How to make it works?

Thanks before

Answer 1

The use of append on $("#result") will not append to the value of the textarea like you may expect - for that you need to use the val() function.

So instead, to overwrite all the contents of the textarea, use:

$("#result").val($("#temp").val());

To append to the contents of the textarea, use something similar to:

var $result = $("#result"); 
$result.val($result.val() + $("#temp").val());