基于锚中的标记添加样式

Question

我在列表中有一些链接（li）li中可能有一个，两个或三个ul。 li再次拥有<a>，而某些主播包含文字或图标

这是代码

<ul>
   <li><a href="#">prev</a></li>
   <li><a href="#">Next</a></li>
</ul>

或

<ul>
   <li><a href="#"><i class="fa-left"></i></a></li>
   <li><a href="#">Next</a></li>
</ul>

或

<ul>
   <li><a href="#"><i class="fa-left"></i></a></li>
   <li><a href="#"><i class="fa-right"></i></a></li>
</ul>

我想要什么

如果有两个li，a将border-radius:25px i，但如果有一个text且一个a或两者都是文字， border-radius:0px将var thumbLinkList = $('li'); var thumbLink = $('li a'); thumbLink.each(function( index,elem ){ if($(this).find('i')){ if($(this).parent().siblings('li').find('i')){ $(this).css({ 'border-radius' : '25px' }) } } })

这是我的尝试

real

Answer 1

也许是这样的：

$('ul').each(function(ind, ele){
    var $ul = $(ele),
        doRad = $ul.find('a > i').length > 1;
    if(doRad){
        $ul.find('a').css('border-radius', '25px');
    }
});

Answer 2

＆＃13;

＆＃13;

$('ul').each(function() {
  
  if ($('i', $(this)).length > 1) {
    $('a',$(this)).css('border-radius','10px')
  }
  
});

＆＃13;

i, a {
  display: block;
  width: 30px;
  height: 30px;
  background: red;
  overflow: hidden;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<ul>
   <li><a href="#">prev</a></li>
   <li><a href="#">Next</a></li>
</ul>

<ul>
   <li><a href="#"><i class="fa-left"></i></a></li>
   <li><a href="#">Next</a></li>
</ul>

<ul>
   <li><a href="#"><i class="fa-left"></i></a></li>
   <li><a href="#"><i class="fa-right"></i></a></li>
</ul>

＆＃13;

＆＃13;

＆＃13;