Javascript Jquery中的条件

我在列表中有多个元素，我想做一个条件，通过图标更改这些值

在谷歌控制台：

$（'li#valorar'）

显示：

[
  <span id=​"valorar">​4​</span>​
 , 
  <span id=​"valorar">​1​</span>​
 , 
  <span id=​"valorar">​5​</span>​
]

[
​4.​​
, 
​1.​​
, 
​5.​​
]

我的条件是：

var valoraciond = $('li #valorar').html();

    if (valoraciond == 0) {
     $('li #valorar').replaceWith('<span style="color:#fff" class="icon star-empty"></span><span style="color:#fff" class="icon star-empty"></span><span style="color:#fff" class="icon star-empty"></span><span style="color:#fff" class="icon star-empty"></span><span style="color:#fff" class="icon star-empty"></span>');
    }else if (valoraciond == 1) {
     $('li #valorar').replaceWith('<span style="color:#fff" class="icon star"></span><span style="color:#fff" class="icon star-empty"></span><span style="color:#fff" class="icon star-empty"></span><span style="color:#fff" class="icon star-empty"></span><span style="color:#fff" class="icon star-empty"></span>');
    }else if (valoraciond == 2) {
     $('li #valorar').replaceWith('<span style="color:#fff" class="icon star"></span><span style="color:#fff" class="icon star"></span><span style="color:#fff" class="icon star-empty"></span><span style="color:#fff" class="icon star-empty"></span><span style="color:#fff" class="icon star-empty"></span>');
    }else if (valoraciond == 3) {
     $('li #valorar').replaceWith('<span style="color:#fff" class="icon star"></span><span style="color:#fff" class="icon star"></span><span style="color:#fff" class="icon star"></span><span style="color:#fff" class="icon star-empty"></span><span style="color:#fff" class="icon star-empty"></span>');
    }else if (valoraciond == 4) {
     $('li #valorar').replaceWith('<span style="color:#fff" class="icon star"></span><span style="color:#fff" class="icon star"></span><span style="color:#fff" class="icon star"></span><span style="color:#fff" class="icon star"></span><span style="color:#fff" class="icon star-empty"></span>');
    }else if (valoraciond == 5) {
     $('li #valorar').replaceWith('<span style="color:#fff" class="icon star"></span><span style="color:#fff" class="icon star"></span><span style="color:#fff" class="icon star"></span><span style="color:#fff" class="icon star"></span><span style="color:#fff" class="icon star"></span>')
    }else{
    }

var valoraciond=$（'li#valorar'）.html（）；
如果（valoraciond==0）{
$（'li#valorar'）。替换为（''；
}else if（valoraciond==1）{
$（'li#valorar'）。替换为（''；
}else if（valoraciond==2）{
$（'li#valorar'）。替换为（''；
}否则如果（valoraciond==3）{
$（'li#valorar'）。替换为（''；
}else if（valoraciond==4）{
$（'li#valorar'）。替换为（''；
}否则如果（valoraciond==5）{
$（'li#valorar'）。替换为（''）
}否则{
}

为什么只取第一个元素？如何获取所有项目？对不起我的英语
评论员说得对：问题是你使用的是ID，ID应该是唯一的。如果您的ID不是唯一的，那么您的HTML无效，您不能指望jQuery神奇地处理这个问题

顺便说一句，你的代码不是很枯燥。所有那些重复的HTML！它可以全部替换为以下内容：

$('li.valorar').each(function(){
    var stars = Number( $(this).html() );
    var html = '';
    // TODO: error handling if stars is not a number
    // add stars
    for( var i=0; i<stars; i++ ) {
        html += '<span style="color:#fff" class="icon star"></span>';
    }
    // add empty stars
    for( ; i<5; i++ ) {
        html += '<span style="color:#fff" class="icon star-empty"></span>';
    }
    $(this).html( html );
});

$（'li.valorar'）。每个（函数（）{
var stars=Number（$（this.html（））；
var html=''；
//TODO:如果星号不是数字，则进行错误处理
//加星星
对于（var i=0；IID必须是唯一的，对吗？是的，id是唯一的。HTML代码：
1>2>3>4>
，那么为什么当“#valorar”足够时选择器“li#valorar”就足够了？因为@undefined stated id必须是唯一的，所以当id不唯一时，将id更改为ClassID，查询只返回匹配的第一个元素。