JSFiddle - React, Tailwind, and code Playground

JavaScript

function genera_tabla() {
  // Obtener la referencia del elemento body donde insertaras tu tabla
  var body = document.getElementsByTagName("body")[0];
 
  // Crea un elemento <table> y un elemento <tbody>
  var tabla   = document.createElement("table");
  var tblBody = document.createElement("tbody");
 
  //Variables de la duración de la tarea
  //Comienza en mi fecha 5 de las 15 que muestro
 	var idFechaInicial=5; 
  //Durará 15 días
  var duracion=5;
  var aux = duracion;
  
  
  // Crea las celdas
  for (var i = 0; i < 2; i++) {
    // Crea las hileras de la tabla
    var hilera = document.createElement("tr");
    for (var j = 0; j < 15; j++) {
      // Crea un elemento <td> y un nodo de texto, haz que el nodo de
      // texto sea el contenido de <td>, ubica el elemento <td> al final
      // de la hilera de la tabla

			//Si la fecha esta entre la fecha 5 y los próximos 5 días y no es la primera fila
      if((j+1)>=idFechaInicial && aux>0 && i>0){
        var celda = document.createElement("td");
        //Inicio de la tarea
        if((j+1)==idFechaInicial)
        	celda.style.backgroundColor = "yellow"; 
        //Días intermedios
        else if(aux==1)
        	celda.style.backgroundColor = "blue"; 
        //Final de la tarea
        else
        	celda.style.backgroundColor = "red"; 
         
        //Llamas una funcion cuando hace click en algun dia de la tarea 
        celda.onclick = function (){click()};
         
        var textoCelda = document.createTextNode("Tarea 1");
        aux--;
      }
      //Si corresponde a la primera columna (tus fechas)
      else if(i==0){
        var celda = document.createElement("td");
        var textoCelda = document.createTextNode("Fecha "+(j+1));
       }
       //Si es una fecha en que tu tarea no se ejecuta
       else{
       		var celda = document.createElement("td");
        	var textoCelda = document.createTextNode(" ");
       }
      celda.appendChild(textoCelda);
     ...