JSFiddle - React, Tailwind, and code Playground

by amrita2

HTML

<p id="showLess" class="less">
				<span class="day"></span>
				<span class="abbrDay"></span>
					<a href="#" class="more"> (show)</a>
			</p>



			<div id="showMore" class="col-md-12 no-padding more">
				<p>			
					<span class="day">Monday</span> <span
						class="abbrDay">MON</span>
				</p>
				<p>

					<span class="day">Tuesday</span> <span
						class="abbrDay">TUE</span>
				</p>
				<p>					<span class="day">Wednesday</span> <span
						class="abbrDay">WED</span>
				</p>
				<p>					<span class="day">Thursday</span> <span
						class="abbrDay">THURS</span>
				</p>
				<p>					<span class="day">Friday</span> <span
						class="abbrDay">FRI</span>
				</p>
				<p>					<span class="day">Saturday</span> <span
						class="abbrDay">SAT</span>
				</p>
				<p>					<span class="day">Sunday</span> <span
						class="abbrDay">SUN</span>
							<a href="#" class="less"> (hide)</a>
				</p>
			</div>

JavaScript

var currentTime = new Date();
		var today = currentTime.getDay(); //0-7
		
		var d = new Date();
		var weekday = new Array(7);
		weekday[0]=  "Sunday";
		weekday[1] = "Monday";
		weekday[2] = "Tuesday";
		weekday[3] = "Wednesday";
		weekday[4] = "Thursday";
		weekday[5] = "Friday";
		weekday[6] = "Saturday";
	   
	   alert('today is:'+weekday[today]); 
	   
	   $('#showLess span.day').innerHTML=weekday[today]; 

	   $.each($('#showMore p span.day'), function(index, item) {
			
			if(typeof item.innerHTML != 'undefined') 
			{ 	
				alert('item.text:' +item.innerHTML);
				alert('weekday[today]'+item.innerHTML.indexOf(weekday[today])); 

				if(item.innerHTML.indexOf(weekday[today])!=-1) { 
					alert("check which element has added class currentDay:");
					item.addClass('currentDay');
				}
				else {
					if(item.hasClass('currentDay')) { item.removeClass('currentDay'); }
				}
			} 
        });

	$('.less').on('click', function(e) {
			$('#showMore').show();
			$('#showLess').hide();
		});

		$('.more').bind('click', function(e) {
			$('#showLess').show();
			$('#showMore').hide();
		});