jquery样式未应用于其元素

给出以下代码。考虑下面的问题,为什么里面有东西 #d1 不是从“命令”中获取样式,我尝试使用 .addClass 也可以显示我的菜单。以下项目是下拉菜单。如果我添加 ("alert("hello");") 它将打印出该消息,尽管它永远不会应用这些样式或类。为什么会这样?

    $('#d1').click(function () {
   $(this).attr('style', 'display: block!important');
});

.dropdown-list {
        display: none;
    }
    .active {
    color: red; }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<nav>
            <div class="logo">LOGO</div> 
            <ul>
                <li><a href="#" class="active">Home</a></li>
                <li><a id="d1" href="#">Projects</a>
                <ul class="dropdown-list" onclick="myFunction(this)">                    
                    <li><a style="line-height: 0;" href="#">Pictures</a></li>
                    <li><a style="line-height: 0;" href="#">Movies</a></li>
                    <li><a style="line-height: 0;" href="#">Slow-mo</a></li>
                </ul>
                </li>
                <li><a id="d2" href="#">About me</a>
                    <ul class="dropdown-list">                    
                        <li><a style="line-height: 0;" href="#">CV</a></li>
                        <li><a style="line-height: 0;" href="#">Phone</a></li>
                    </ul>
                    </li>
                <li><a href="#">Contact</a></li>
            </ul>
        </nav>

谢谢。