Priority of style and jquery modification styles

problem description

first of all, I hid all the elements. I wanted to reappear him for the div4 tag by id in jquery, but I didn"t reflect it. I don"t know why

the environmental background of the problems and what methods you have tried

related codes

/ / Please paste the code text below (do not replace the code with pictures)

< html >

<head>
    <meta charset="UTF-8">
    <title></title>
    <style>
        -sharpdiv1,-sharpdiv2,-sharpdiv3,-sharpdiv4{
            display:none;
        }
    </style>
    <script type="text/javascript" src="js/jquery-1.8.2.js"></script>
    <script type="text/javascript">
        $(function(){
            $("-sharpdiv4").css("display","block");
        })
    </script>
</head>
<body>
    <div>
        <div id="div1">
            id div1
            <div id="div4" class="hello" >
                1div
            </div>
        </div>
        <div id="div2">
            2div
        </div>
        <div id="div3">
            3div
        </div>
    </div>
    
</body>

< / html >

what result do you expect? What is the error message actually seen?

I don"t know why the later style can"t change the previous one.

Mar.31,2021

div4 in div1, div1 is hidden, div4 will not be displayed whether it is displayed or not


two questions:
1. It has been said upstairs that DIV4 is already in the invisible DIV1, so no matter how it is changed, it will always be invisible

.

2. JS needs to be placed at the tail of HTML.

Menu