<ul style="list-style:none;" id="menu_ul">
<li id="cl">1й ли</li>
<li id="cl">2-й ли</li>
<li id="cl">3й ли</li>
</ul>function say(){
alert(cl2);
}
for (var i = 0; i < cl.length; i++) {
var cl2 = cl[i].innerHTML;
cl[i].addEventListener("click", say);
}
document.getElementById('menu_ul').addEventListener('click', function(e) {
alert(e.target.innerText);
});<ul style="list-style:none;" class="menu">
<li class="cl">1й ли</li>
<li class="cl">2-й ли</li>
<li class="cl">3й ли</li>
</ul>$(document).ready(() => {
$('.menu').on('click', '.cl', onListItemClick)
})
function onListItemClick() {
alert(this.innerHTML)
}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>StarHunter</title>
<link rel="stylesheet" type="text/css" href="style/style.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>
</head>
<body>
<header>
<nav></nav>
</header>
<ul>
<li class="li">1111</li>
<li class="li">2222</li>
<li class="li">3333</li>
</ul>
<script>
$(document).ready(function(){
$(".li").click(function(){
$(this).css("color", "red");
});
});
</script>
</body>
</html>