---

<!DOCTYPE html>
<html lang="ru">
<head>
    <meta charset="UTF-8">
    <title>Работа с jQuery</title>

    <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>

    <style>
        #code{
            background-color:#fffDBD;
            margin:10px;
            padding:5px;
        }
    </style>
</head>
<body>

<div id="code">

    <p>
        1. После одинарного нажатия на кнопку с id="but1" цвет текста абзаца
        с id="par1" должен измениться на зеленый, а размер шрифта стать 20px.
        При двойном нажатии оформление должно вернуться к стандартному.
    </p>

    <h3>Я первый заголовок на странице.</h3>

    <p id="par1">Я первый абзац на странице.</p>

    <button id="but1">Нажмите на меня</button>

    <br><br>

    <p>
        2. При наведении указателя мыши на ссылку ее цвет должен измениться на
        оранжевый. При выведении указателя мыши оформление должно сброситься.
    </p>

    <a href="#" id="href1">wisdomweb.ru</a>

    <br><br>

    <p>
        3. При выделении текста элемента с id="text1" его цвет должен стать
        красным, а размер шрифта — 20px.
    </p>

    <input type="text" id="text1" value="Выделите мой текст">

    <br><br>

    <p>
        4. При щелчке по кнопке с id="but2" оформление абзаца с id="par2"
        должно стать шрифтом Arial синего цвета.
    </p>

    <p id="par2">
        Мое оформление будет меняться после каждого нажатия на кнопку ниже.
    </p>

    <button id="but2">Изменить оформление абзаца</button>

</div>

<script>

$(document).ready(function(){

    // Задание 1
    $("#but1").click(function(){
        $("#par1").css("color","green")
                  .css("font-size","20px");
    });

    $("#but1").dblclick(function(){
        $("#par1").css("color","")
                  .css("font-size","");
    });

    // Задание 2
    $("#href1").mouseover(function(){
        $(this).css("color","orange");
    });

    $("#href1").mouseout(function(){
        $(this).css("color","");
    });

    // Задание 3
    $("#text1").focus(function(){
        $(this).css("color","red")
               .css("font-size","20px");
    });

    // Задание 4
    $("#but2").click(function(){
        $("#par2").css("font-family","Arial")
                  .css("color","blue");
    });

});

</script>

</body>
</html>