为什么用jQuery选择器样式出不来啊

标题应该为红色
ul前面符号应该是正方形
li前面符号是三角形

html>
<html>
    <head>
        <meta charset="utf-8">
        <title>title>
        <script src="https://code.jquery.com/jquery-3.1.1.min.js">script>
        <script type="text/javascript">
            $(function(){
                            $(":input").click(function(){
                                $(":header").css("color","red");
                                $(":header+ul").css("list-style-type","upper-roman");
                                $(":header+ul>li>ul").css("list-style-type","lower-alpha");
                            })
                        })
                    script>
                head>
                <body>
                    <h2>Web前端技术h2>
                    <ul>
                        <li>使用DIV+CSS设计前端网页li>
                        <ul>
                            <li>页面布局li>
                            <li>美化页面li>
                            <li>页面特效li>
                        ul>
                        <li>使用JavaScript+Jquery制作页面特效li>
                        <ul>
                            <li>JavaScript基础li>
                            <li>Jquery选择器li>
                            <li>Jquery操作DOMli>
                        ul>
                    ul>
                    <input type="button" value="更改样式" />
    body>
html>

  • upper-roman是大写罗马数字

  • lower-alpha是小写英文字母

  • list-style属性值也没有三角形

  • li的层级应该是(":header+ul>ul>li")


<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title></title>
    <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script>
$(function() {
      $(":input").click(function() {
            $(":header").css("color", "red");
            $(":header+ul").css("list-style-type", "square");
            $(":header+ul>ul>li").css("list-style-type", "lower-alpha");
        });
  })
</script>
  </head>
  <body>
    <h2>Web前端技术</h2>
    <ul>
      <li>使用DIV+CSS设计前端网页</li>
      <ul>
        <li>页面布局</li>
        <li>美化页面</li>
        <li>页面特效</li>
      </ul>
      <li>使用JavaScript+Jquery制作页面特效</li>
      <ul>
        <li>JavaScript基础</li>
        <li>Jquery选择器</li>
        <li>Jquery操作DOM</li>
      </ul>
    </ul>
    <input type="button" value="更改样式" />
  </body>
</html>
 

你的 :header 是个啥?