javascriptで現在の日に従って月、日付、日を動的にする方法は？

var monthNames = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
var dayNames = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];

$('.date-box').each(function(i) {
  var newDate = new Date();
  newDate.setDate(newDate.getDate() + (i + 2));  

  var $date = $(this);
  $date.find('.month').text(monthNames[newDate.getMonth()]);
  $date.find('.date').text(newDate.getDate());
  $date.find('.day').text(dayNames[newDate.getDay()]);
});

.custom_date,
.custom_time {
  width: 1000px;
}

.custom_date ul {
  margin: 0px;
  padding: 0px;
}

.custom_date ul li {
  list-style: none;
  float: left;
  border: 1px solid #ccc;
  padding: 2px;
  margin: 0px 5px;
  width: 60px;
  font-size: 10px;
  text-align: center;
  vertical-align: middle;
  min-height: 55px;
}

.custom_date ul li:nth-child(1) span,
.custom_date ul li:nth-child(2) span {
  padding-top: 28%;
}

.custom_date ul li span {
  display: block;
}

.custom_date ul li span.lead {
  font-size: 1rem;
  line-height: 16px;
}

.custom_date ul li.active {
  background: #f44336;
  border-color: #f44336;
  color: white;
}

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js"></script>

<div class="custom_date">
  <ul>
    <li>
      <span>Today</span>
    </li>
    <li>
      <span>Tomorrow</span>
    </li>
    <li class="date-box">
      <span class="month"></span>
      <span class="date"></span>
      <span class="day"></span>
    </li>
    <li class="date-box">
      <span class="month"></span>
      <span class="date"></span>
      <span class="day"></span>
    </li>
    <li class="date-box">
      <span class="month"></span>
      <span class="date"></span>
      <span class="day"></span>
    </li>
    <li class="date-box">
      <span class="month"></span>
      <span class="date"></span>
      <span class="day"></span>
    </li>
    <li class="date-box">
      <span class="month"></span>
      <span class="date"></span>
      <span class="day"></span>
    </li>
    <li class="date-box">
      <span class="month"></span>
      <span class="date"></span>
      <span class="day"></span>
    </li>
    <li class="date-box">
      <span class="month"></span>
      <span class="date"></span>
      <span class="day"></span>
    </li>
    <li class="date-box">
      <span class="month"></span>
      <span class="date"></span>
      <span class="day"></span>
    </li>
    <li class="date-box">
      <span class="month"></span>
      <span class="date"></span>
      <span class="day"></span>
    </li>
    <li class="date-box">
      <span class="month"></span>
      <span class="date"></span>
      <span class="day"></span>
    </li>
  </ul>
</div>