Malleys,
спасибо за hyperapp, но никак не пойму зачем менять DOM по каждому клику, если нужно изменить только класс и чем плохо jQuery?
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style>
ul>li:not(.show) {
text-decoration: line-through;
}
ul>li:focus{
outline: none;
}
</style>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
$(() =>{
const items = ["text 1", "text 2", "text 3", "text 4"],
html = items.map(text => $("<li>",{tabIndex: 0, text})),
li = $("<ul>", {html})
.replaceAll("#app")
.on("focusin focusout", "li", ({type}) => li.toggleClass("show", type == "focusin")).
find("li");
});
</script>
</head>
<body>
<div id="app"></div>
</body>
</html>