鼠标经过导航这个类名为navigation_describe的div时候，让类名为navigation_other的div显示出来，使用js获取类添加onmouseenter事件，但是仍然无法改变navigation_other的display，请问我哪里写错了？怎么改？

<div class='header'>
    <div class='navigation_index'>
        <div class='navigation'>
            <div class='navigation_describe'>
                导航
            </div>
        </div>
    </div>

    
    <div class='navigation_other'>
        首页
    </div>
    
    <div class='navigation_other'>
        征婚信息
    </div>
</div>

.header {
    width: 100%;
    overflow: hidden;
    background: rgba(0,0,255,1);
}

.navigation_index {
    height: 50px;
    width: 100%;
    background: rgba(102,0,204,1);
    padding-top: 10px;
}

.navigation_index:before {
    content: '';
    display: block;
    clear: both;
    height: 0;
}

.navigation_index:after {
    content: '';
    display: block;
    clear: both;
    height: 0;
}

.navigation {
    box-sizing: border-box;
    height: 30px;
    width: 50px;
    margin-top: 0;
    background: rgba(155,155,155,1);
    padding-top: 6px;
    padding-bottom: 6px;
    border-top: 6px solid rgba(0,255,255,1);
    border-bottom: 6px solid rgba(155,155,155,1); /*定义实线*/
    background-clip: content-box;
    position: relative;
}

.navigation_describe {
    position: absolute;
    left: 0;
    top: -6px;
    height: 30px;
    line-height:30px;
    width: 50px;
    background: rgba(102,51,153,1);
    color: rgba(255,255,255,1);
    text-align: center;
    z-index: 10;
    
}

.navigation_other {
    height: 50px;
    line-height: 50px;
    display: none;
}

document.getElementsByClassName("navigation_index")[0].mouseenter=function(){
    console.log('鼠标经过事件');
    document.getElementsByClassName("navigation_other")[0].style.display="block";  //鼠标滑入显示；
}