program1

HTML

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
    <title>Bootstrap 101 Template</title>

    <!-- Bootstrap -->
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="css/style.css" />
    
    <script
  src="https://code.jquery.com/jquery-2.2.4.js"
  integrity="sha256-iT6Q9iMJYuQiMWNd9lDyBUStIq/8PuOW33aOqmvFpqI="
  crossorigin="anonymous"></script>
    <script type="text/javascript" src="js/script.js"></script>

    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
  </head>
  <body>
  
   
   <div class="container-fluid">
   <div class="row">
       <div class="col-md-12">
       <h1>Test</h1>
       </div>
   </div>
    
    <div class="row">
       
       <div class="col-md-12">
       
       <textarea class="form-control" id="mytextarea" rows="3"></textarea>
       
        </div>
       
       <div class="col-md-12">
       
       <button type="button" class="btn btn-primary" id="sending_button1">Send</button>
       
        </div>
        
       
       </div>
       
       <div class="row">
       <div class="col-md-12">
          <table class="table table-striped" id = "my-table">
           <thead>
            <tr>
                <th>Date</th>
                <th>Example</th>
                
            </tr>
              </thead>
              <tbody>
                <tr>
              <td>today</td>
        ...

JavaScript

$(document).ready(function(){
    var today = new Date();
    var dd = today.getDate();
    var mm = today.getMonth()+1; //January is 0!
    var yyyy = today.getFullYear();
    if(dd<10) {
    dd='0'+dd
    } 

    if(mm<10) {
    mm='0'+mm
    } 
    today = mm+'/'+dd+'/'+yyyy;
    var counter = 1;
    

    $('button.btn.btn-primary').click(function(){
        var text = $('textarea#mytextarea').val();
        $('#my-table').append('<tr><td>today</td><td>text</td><td><button type="button" class="delete-button btn btn-danger">Usuń</button></td></tr>');
        $('textarea#mytextarea').val('');
        counter++;
        
    });
    
    
    $('button.btn.btn-danger').click(function(){
        $(this).parents('tr').remove();  
        
    });
    
    //$('button.btn.btn-danger').on( "click", function( event ) {
    //$( event.target ).closest( "tr" ).remove();
    //});

    
    
});