Я начинающий разработчик, столкнулся вот с такой проблемой: мне нужно применить одновременно несколько стилей для абзаца, но применяется только один и последний по выбору. Помогите кто сможет, заранее благодарен.
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>JavaScript</title>
<style>
</style>
</head>
<body>
<ul>
<p>Lorem ipsum dolor sit amet.</p>
<input type="checkbox" value="text-decoration:line-through;"><span>перечеркнуть</span>
<input type="checkbox" value="font-weight:bold;"><span>сделать жирным</span>
<input type="checkbox" value="color:red"><span>сделать красным</span>
<script>
let text = document.querySelector('p')
let input = document.querySelectorAll('input')
for(var i = 0; i < input.length; i++){
input[i].addEventListener('change', func)
}
function func(){
if(this.checked){
text.style.cssText = this.value
}else{
text.style.cssText = 'none'
}
}
</script>
</body>
</html>