怎么用原生js实现展开收起box的功能

如何用原生js实现展开收起box的功能？
如何用原生js实现展开收起box的功能？

HTML code

<dl class="member_box dn">    <dt><a id="member_box_root" href="#">Log in</a></dt>    <dd>            2222222222    </dd></dl><dl class="member_box">    <dt><a id="member_box_root" href="#">Log in</a></dt>    <dd>            2222222222    </dd></dl><style type="text/css">    .member_box{        border:1px solid red;    }    .member_box dd{        display:block;    }    .member_box.dn{        border:none;    }    .member_box.dn dd{        display:none;    } </style>

[解决办法]
点击dt判断dd 的 style.display=='none'

如果none则改为block 反之
顺便说下 你的ID用的重复了