JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://unpkg.com/[email protected]/bundles/Rx.min.js"></script>
		<ul class="ul" id="ul">
			<li class="li" id="link_0" data-count="5">1-3</li>
			<li class="li" id="link_1" data-count="10">4-5</li>
			<li class="li" id="link_2" data-count="30">6-7</li>
			<li class="li" id="link_3" data-count="100">7-9</li>
			<li class="start" id="start">start</li>
		</ul>	

		<div class="content" id="content">
			<div class="content-inner" id="contentInner"></div>
		</div>

CSS

body{
  padding: 0px;
  margin: 0px;
  height: 100vh;
  width: 100vw;
  overflow: hidden;
}

	ul{
		width: 100%;
		background: cyan;
		height: 40px;
		margin: 0;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;		
	}

		li{
			display: inline-block;
			background: orange;
			height: 20px;
			margin: 0 10px;
			padding: 0 10px;
		}


.content{
	overflow: hidden;
	overflow-y: auto;
	height: calc(100% - 40px);
}

	.content-inner{
		padding: 10px;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;		
	}

		.point{
			background: red;
			color: #fff;
			display: flex;
			flex-wrap: wrap;
			justify-content: center;
			align-items: center;			
			padding: 10px;
			width: 30px;
			height: 30px;	
			margin: 0 10px;
		}

JavaScript

let currNum;
let step;
let startContent = 'Это простейший тренажёр для детей, он проверяет способность считать. Предполагается, что: \
<br>дети от 1 до 3 лет должны уметь считать до 5 \
<br>дети от 4 до 5 лет должны уметь считать до 10 \
<br>дети от 6 до 7 лет должны уметь считать до 30 \
<br>дети от 7 до 9 лет должны уметь считать до 100 \
	<br><br>Чтобы проверить знания участнику предлагается последовательно в порядке возрастания выбрать кубики с цифрами \
';

function init() {
	currNum = -1;
	step = 0
	let startBtn = document.getElementById('start');
	startBtn.click();
};

function clearContent() {
	let contentInner = document.getElementById('contentInner');
	contentInner.innerHTML = '';
};

function deletePoint(id) {
	let pointEl = document.getElementById(id);
	pointEl.parentNode.removeChild(pointEl);
};

function createPoints(count) {
	let contentInner = document.getElementById('contentInner');

	for(let i = 0; i <= 2; i++) {
		let num_ = Math.random() * count;
		let num = Math.ceil(num_);

		let pointEl = document.createElement('div');
		pointEl.className = 'point';
		pointEl.id = 'point_' + i;
		pointEl.setAttribute('data-num', num);
		pointEl.innerHTML = num;		

		contentInner.appendChild(pointEl);
	};
};


function ready() {
	let ulEl = document.getElementById('ul');
	let contentInnerEl = document.getElementById('contentInner');

	let menu = Rx.Observable.fromEvent(ulEl, 'click');
	let contentInner = Rx.Observable.fromEvent(contentInnerEl, 'click');

	let subscription = menu
	.map(e => e.target)
	.filter(t => t.className === 'start' || t.className === 'li')
	.subscribe(function (t) {
		clearContent();
    switch (t.className) {
      case 'start':
				document.getElementById('contentInner').innerHTML = startContent;
        break;
      case 'li':				
				createPoints(t.getAttribute('data-count'));
        break;
    }
	});

	let subscription3 = contentInner
	.map(e => e.target)
	.filter(t => t.className === 'point')
	.subscribe(function (t) {
		let val...