I'm doing a calendar in jQuery. How could I do it so that the tbody does not repeat itself? I still do not have the conditions for the years but it is the least. Thank you in advance.
$(function(){
var weekday= ["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"];
var months = ["January","February","March","April","May", "June", "July","August","September","October","November","December"];
var d = new Date();
var day = d.getDate();
var month = d.getMonth();
var year = d.getFullYear();
function days(month,year) {
//last day of month
var lastDay = new Date(year,month + 1, 0).getDate();
//first day of month
var a = new Date("1 ,"+months[month]+","+year+"");
//month string
$("#date").html(months[month]+" "+year);
var counter = 0;
$("#days").append("<tr>");
for(var i = 1; i < lastDay+1;i++,counter++){
//blank space
if(i == 1){
for(var j = 0; j < a.getDay();j++,counter++){
$("#days").append("<td></td>");
}
}
//new week
if(counter%7 == 0){
$("#days").append("</tr><tr>");
}
//display days
$("#days").append("<td><a href='?d="+i+"&m="+month+"&y="+year+"'>"+i+"</a></td>");
}
};
days(month,year);
//left click
$("#prev").on("click",function(){
month--;
days(month,year);
});
//right click
$("#next").on("click",function(){
month++;
days(month,year);
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table border="1">
<tr>
<td class="btn" id="prev">⟨</td>
<td id="date" colspan="5"></td>
<td class="btn" id="next">⟩</td>
</tr>
<tr>
<td>SUN</td>
<td>MON</td>
<td>TUE</td>
<td>WEN</td>
<td>THU</td>
<td>FRI</td>
<td>SAT</td>
</tr>
<tbody id="days"></tbody>
</table>