JSFiddle - React, Tailwind, and code Playground

by Jason Huang

HTML

<body>
<div id="container">
<button id="a">remove</button><button id="b">attach</button>
<ul>
</ul>
</div>

CSS

.currentpage{
		color:red;
		font-weight:bold;
		font-size:16px;
	}

JavaScript

var k = 10;	
		myfunction(k);	
			$('#a').click(function(){	
				$('ul li').remove();	
			});			
			$('#b').click(function(){				
				k = 20;
				myfunction(k);			
			});		
			$('ul li').on('mouseenter',function () {
				var num = $(this).index();
				$('#lit' + num).addClass('currentpage');
				$('#lit' + num).siblings().removeClass('currentpage');
				});

function myfunction(p){
	for(var i=0;i<p;i++){
		$('#container ul').append('<li id=lit'+i+'>Hello'+i+'</li>');
	}
}