mserega,
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
.info {
counter-reset: list;
}
.info td{
font-weight: bold;
}
.table-bordered{
width: 300px;
}
.table-bordered .info ~ tr .warning:nth-child(1){
font-weight: bold;
width: 30px;
}
.table-bordered .info ~ tr .warning:nth-child(1):before{
position: absolute;
display: block;
margin-top: -10px;
counter-increment: list;
content: counter(list)".";
color: #FF0000;
}
</style>
<script>
window.addEventListener("DOMContentLoaded", function() {
var form = document.querySelector(".form"),
day = form.querySelector(".day"),
lesson = form.querySelector(".lesson"),
btn = form.querySelector(".btn");
btn.addEventListener("click", function(event) {
event.preventDefault();
var tbody = document.querySelector(".table-bordered tbody"),
str = '<tr><td class="trles warning"></td><td>' + lesson.value + "</td></tr>",
tr = tbody.querySelectorAll(".info")[day.value];
tr ? tr.insertAdjacentHTML("beforeBegin", str) : tbody.insertAdjacentHTML("beforeEnd", str)
})
});
</script>
</head>
<body>
<table class="table table-bordered">
<!-- Понеділок -->
<tr class="info"><td align="center" colspan="2">Понеділок</td></tr>
<tr><td class="trles warning"></td><td>Навчання грамоти (чит)</td></tr>
<tr><td class="trles warning"></td><td>Математика</td></tr>
<tr><td class="trles warning"></td><td>Основи здоров'я</td></tr>
<tr><td class="trles warning"></td><td>Навчання грамоти (укр.м.)</td></tr>
<tr><td class="trles warning"></td><td>Фізична культура</td></tr>
<!-- /Понеділок -->
<!-- Вівторок -->
<tr class="info"><td align="center" colspan="2">Вівторок</td></tr>
<tr><td class="trles warning"></td><td>Навчання грамоти (читання)</td></tr>
<tr><td class="trles warning"></td><td>Навчання грамоти (укр. мова)</td></tr>
<tr><td class="trles warning"></td><td>Математика</td></tr>
<tr><td class="trles warning"></td><td>Іноземна</td></tr>
<tr><td class="trles warning"></td><td>Музичне мистецтво</td></tr>
<!-- Вівторок -->
<!-- Середа -->
<tr class="info"><td align="center" colspan="2">Середа</td></tr>
<tr><td class="trles warning"></td><td>Навчання грамоти(чит.)</td></tr>
<tr><td class="trles warning"></td><td>Математика</td></tr>
<tr><td class="trles warning"></td><td>Навчання грамоти (укр. мова)</td></tr>
<tr><td class="trles warning"></td><td>Природознавство</td></tr>
<tr><td class="trles warning"></td> <td>Фізична культура</td></tr>
<!-- Середа -->
<!-- Четвер -->
<tr class="info"><td align="center" colspan="2">Четвер</td></tr>
<tr><td class="trles warning"></td><td>Природознавство</td></tr>
<tr><td class="trles warning"></td><td>Образотворче мистецтво</td></tr>
<tr><td class="trles warning"></td><td>Трудове навчання</td></tr>
<tr><td class="trles warning"></td><td>Індивідуальна робота</td></tr>
<!-- Четвер -->
<!-- П'ятниця -->
<tr class="info"><td align="center" colspan="2">П'ятниця</td></tr>
<tr><td class="trles warning"></td><td>Навчання грамоти (чит.)</td></tr>
<tr><td class="trles warning"></td><td>Математика</td></tr>
<tr><td class="trles warning"></td><td>Навчання грамоти (укр.мова)</td></tr>
<tr><td class="trles warning"></td><td>Фізична культура</td></tr>
<!-- П'ятниця -->
</table>
<form action="http://" class="form">
<select name="day" size="1" class="day">
<option value="1">Понеділок</option>
<option value="2">Вівторок</option>
<option value="3">Середа</option>
<option value="4">Четвер</option>
<option value="5">П'ятниця</option>
</select>
<input class="lesson" name="lesson" type="text">
<button class="btn">Добавить урок</button>
</form>
</body>
</html>
