JSFiddle - React, Tailwind, and code Playground
HTML
<select id="dateScope">
<option value="">..select one option...</option>
<option value="w">Weekly</option>
<option value="m">Monthly</option>
<option value="y">Yearly</option>
</select>
<div id="buttonsDiv"></div>
JavaScript
var days = ['Mon','Tues','Wed','Thu','Fri','Sat','Sun'];
function getContent(dateScope)
{
var ret = "";
switch(dateScope) {
case "w": for(i in days)
ret += "<button>"+days[i]+"</button>";
break;
case "m": for(i=1;i<=31;i++)
ret += "<button>"+i+"</button>";
break;
case "y": for(i=1;i<=12;i++)
ret += "<button>"+i+"</button>";
break;
}
return ret;
}
$("#dateScope").change(function(){
$("#buttonsDiv").html(getContent($(this).val()));
});