如何通过html在消息按钮上增加数量角标的实现代码？

<a onclick="goMessage();" style="width: 60px;height: 100%;color: white;background: transparent;" href="#" class="easyui-linkbutton" data-options="iconCls:'fa fa-bell-o fa-2x',size:'large',iconAlign:'top'">消息<span id="msgNum" class="ii">4</span></a>

/*角标 */
  .ii{
    display: none;
    background: #f00;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    top: 5px;
    right: 0px;
    position: absolute;
    text-align: center;
    color: #FFF;
    z-index: 99999;
  }

function ajaxa(){
     $.ajax({
        type:"POST",
        dataType : "json",
        async: false,
        url : "${pageContext.request.contextPath}/docinf/sendInform/lookForMsgNum.do",
        data : {},
        success : function(data){
          if(data !=null){
            if(parseInt(data)>10){
              $("#msgNum").show();
              $("#msgNum").text(parseInt(data));
            }else if(parseInt(data)> 0){
              $("#msgNum").show();
              $("#msgNum").text(parseInt(data));
            }else{
              $("#msgNum").hide();
            }
          }
        },
        error:function(){
        }
      });
  }