SOURCE

$(function(){
  $('#button-add').on('click',function(){
      var item=$('#text-item').val();
      var li='<li>'+item+'</li>';
      var ul=$('#YY');
      ul.append(li);
    });
});

<ul id="YY">
    <li style="color:white">芭蕾</li>
    <li style="color:white">钢琴</li>
    <li style="color:white">爵士</li>
    <li style="color:white">架子鼓</li>
    <li style="color:white">尤克里里</li>
</ul>  
<input type="text" placeholder="请输入新的列表项目" />
<input id="button-add" type="button"  value="新增" style="font-weight:bold"/>

#YY{
    background-color: black
}
#button-add{
    background-color: white
}