locked
jquery append RRS feed

  • Question

  • User-1104215994 posted

    Hi,

    I would like to append text after clearing the text area. How can I achieve it?

    <!DOCTYPE html>
    <html>
    <head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script>
    $(document).ready(function(){
      $("#btn1").click(function(){
        $("#result").append("Test");
      });
    
      $("#btn2").click(function(){
        $("#result").val('');
      });
    });
    </script>
    </head>
    <body>
    <textarea class="form-control" id="result" rows="5" readonly></textarea>
    
    <button id="btn1">Append text</button>
    <button id="btn2">clear</button>
    
    </body>
    </html>
    

    Thursday, August 6, 2020 6:26 PM

Answers

  • User475983607 posted

    I would like to append text after clearing the text area. How can I achieve it?

    It really helps to read the official jQuery reference docs.  The jQuery append() function modifies the DOM.  The val() function gets/sets an input's value.

    <!DOCTYPE html>
    <html>
    <head>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
        <script>
            $(document).ready(function(){
                $("#btn1").click(function () {
                    var val = $("#result").val()
                    $("#result").val(val + "World");
              });
    
              $("#btn2").click(function(){
                $("#result").val('');
              });
            });
        </script>
    </head>
    <body>
    <textarea class="form-control" id="result" rows="5" readonly>Hello </textarea>
    
        <button id="btn1">Append text</button>
        <button id="btn2">clear</button>
    
    </body>
    </html>

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, August 6, 2020 7:14 PM

All replies

  • User475983607 posted

    I would like to append text after clearing the text area. How can I achieve it?

    It really helps to read the official jQuery reference docs.  The jQuery append() function modifies the DOM.  The val() function gets/sets an input's value.

    <!DOCTYPE html>
    <html>
    <head>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
        <script>
            $(document).ready(function(){
                $("#btn1").click(function () {
                    var val = $("#result").val()
                    $("#result").val(val + "World");
              });
    
              $("#btn2").click(function(){
                $("#result").val('');
              });
            });
        </script>
    </head>
    <body>
    <textarea class="form-control" id="result" rows="5" readonly>Hello </textarea>
    
        <button id="btn1">Append text</button>
        <button id="btn2">clear</button>
    
    </body>
    </html>

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, August 6, 2020 7:14 PM
  • User-1104215994 posted

    thank you.

    Thursday, August 6, 2020 7:28 PM