* 겪고 있는 문제 상황을 최대한 자세하게 작성해주세요.

* 문제 해결을 위해 어떤 시도를 해보았는지 구체적으로 함께 알려주세요.

제목과 같이 JQuery 시작하기에서 사용하는 건 어떤 기능을 하게 해주는 JQuery인가요? 어떤 기능인지 모르고 따라서 사용한 하려니 이해가 잘 안가는 것 같아서 질문드립니다.

전체 화면 캡처.

 <title>스파르타플렉스</title>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet"

        integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">

    <style>

        @import url('https://fonts.googleapis.com/css2?family=Nanum+Pen+Script&display=swap');

        * {

            font-family: 'Nanum Pen Script', cursive;

        }

        .main {

            color: white;

            background-image: url('https://occ-0-1123-1217.1.nflxso.net/dnm/api/v6/6AYY37jfdO6hpXcMjf9Yu5cnmO0/AAAABeIfo7VL_VDyKnljV66IkR-4XLb6xpZqhpLSo3JUtbivnEW4s60PD27muH1mdaANM_8rGpgbm6L2oDgA_iELHZLZ2IQjG5lvp5d2.jpg?r=e6e.jpg');

            background-position: center;

            background-size: cover;

        }

        body {

            background-color: black;

        }

        .myCards {

            width: 1200px;

            margin: 20px auto 20px auto;

        }

        .mypostingbox {

            width: 500px;

            margin: 20px auto 20px auto;

            border: 1px solid white;

            border-radius: 3px;

            padding: 20px;

        }

        .form-floating>input {

            background-color: transparent;

            color: white;

        }

        .form-floating>label {

            color: white;

        }

        .input-group>label {

            background-color: transparent;

            color: white;

        }

        .mypostingbox>button {

            width: 100%;

        }

    </style>

    <script>

     function hey() {

       $('#title').text('쥬라기월드');

     }

    </script>