title: How to remove an entire table using javascript?
body: <p>I have a calendar table, that shows the entire month's date, if user chose to see next month or previous I need to delete the entire table and replace the new table in that same place, at the moment each table is loading underneath the other because I cant get this to work.</p>
  
  <p>I need to remove table from calendar-dates. but I had no luck. I have used <strong>removechild("tb")</strong> but didnt work, I also tried var <strong>test = document.getElementById("calendarDates");
                      test.removeChild(test.childNodes[0]);</strong></p>
  
  <p>Here is the code for the table:</p>
  
  <pre><code>document.getElementById("calendar-dates").appendChild(calendar);
  </code></pre>
  
  <p>Table:</p>
  
  <pre><code> //add calendar table
      function get_calendar(day_no, days, m , y){
          var table = document.createElement('table');
          table.id = "tb";
          var tr = document.createElement('tr');
  
          //row for the day letters
          for(var c=0; c&lt;=6; c++){
              var td = document.createElement('td');
              td.innerHTML = "SMTWTFS"[c];
              tr.appendChild(td);
          }
          table.appendChild(tr);
  
          //create 2nd row
          tr = document.createElement('tr');
          var c;
          for(c=0; c&lt;=6; c++){
              if(c == day_no){
                  break;
              }
              var td = document.createElement('td');
              td.innerHTML = "";
              tr.appendChild(td);
          }
  
          var count = 1;
          for(; c&lt;=6; c++){
              var td = document.createElement('td');
              td.innerHTML = count;
              td.style.cursor = "pointer";
              td.id = count;
              td.onclick = function () {
                  m = m + 1;
                  document.getElementById("cDD").value = this.id + "/" + m + "/" + y;
                  document.getElementById("calendar-container").style.display = "none";
  
              };
              count++;
              tr.appendChild(td);
          }
          table.appendChild(tr);
  
          //rest of the date rows
          for(var r=3; r&lt;=7; r++){
              tr = document.createElement('tr');
              for(var c=0; c&lt;=6; c++){
                  if(count &gt; days){
                      table.appendChild(tr);
                      return table;
                  }
                  var td = document.createElement('td');
                  td.innerHTML = count;
                  td.style.cursor = "pointer";
                  td.id = count;
                  td.onclick = function () {
                      m = m + 1;
                      document.getElementById("cDD").value = this.id + "/" + m + "/" + y;
                      document.getElementById("calendar-container").style.display = "none";
                  };
                  count++;
                  tr.appendChild(td);
              }
              table.appendChild(tr);
          }
          return table;
      }
  </code></pre>