Здравствуйте, помогите новичку, пожалуйста. Не работает скрипт ,который предназначен для скрытия блока, при помощи изменения свойста display:none;. Скрипт скрывает блок, но при провторном нажатии, условие else не работает,которое должно менять display: block, ошибок не выдаёт, вот код
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8">
<title>Практика Javascript</title>
<link href="css/style.css" type="text/css" rel="stylesheet" />
</head>
<body onload="fun4(),fun5(),fun6()">
<header>Практика по Javascript</header>
<div id = "wrapper">
<div class="lessonsbox">
<div class="lessons-header" onclick="hide();">
<h1><p><a href="https://www.youtube.com/watch?v=JISFx18J7nc">Урок 1</a></p></h1>
</div>
<div id="lesson_1" class="lessons">
<div class="iframe"><iframe width="760" height="515" src="https://www.youtube.com/embed/JISFx18J7nc" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe></div>
<form>
<label><input type="checkbox" id="one" onchange="checkSelectCheckbox();console.log('CLICK CHECKBOX')">Пример checkbox</label><br>
<input type="radio" name="r1" value="5"> 0
<input type="radio" name="r1" value="6"> 1
<input type="radio" name="r1" value="7"> 2 <br>
<button onclick="fun2();">Проверить на выбранные элементы radio</button>
</form>
</div>
</div>
<script type="text/javascript" src="js.js"></script>
</body>
</html>
Javascript
function hide() {
var div3 = document.querySelector('#lesson_1');
if (div3.style.display = 'block') {
div3.style.display = 'none';
}
else {div3.style.display = 'block';}
}