无法使用jQuery更改文本颜色

时间:2016-02-28 14:27:54

标签: javascript jquery html css

我无法使用jQuery更改文本颜色。我已经经历了其他类似的问题并试图实现解决方案,但不知何故它无法正常工作。不知道我哪里错了。请帮忙。我创建了一个demo

CODE HTML

    <div class="wrapper">
<button class="addItem">Add Item</button>
<button class="removeItem">Remove Last Item</button>
<div class="clear">

</div>
<div class="colr blue">blue</div>
<div class="colr red">red</div>
<div class="clear">

</div>
<ul class="items">
<li class="newItem">ONE</li>
<li class="newItem">ONE</li>
</ul>
</div>

CSS

.clear{
  clear:both;
}
.colr{
  height:20px;
  width:50px;
  float:left;
  color:white;
  padding:10px;
  margin:10px;
  text-align:center;
  cursor:pointer;
}

.blue{
  background:blue;

}

.red{
  background:red;
}

的jQuery

$(document).ready(function(){
    $('.addItem').click(function(){
    $('.items').append("<li class=\'newItem\'>NEW ITEM</li>");
  });
  $('.removeItem').click(function(){
    $('.items li:last-child').remove();

  });
  $('blue').click(function(){
    $('.items').css('color','blue');
  });
  $('red').click(function(){
    $('.newItem').css('color','red');
  });
});

1 个答案:

答案 0 :(得分:0)

您可以在此尝试此代码

$('.blue').click(function(){ 
    $('.items').css('color','blue');
  });
  $('.red').click(function(){
    $('.newItem').css('color','red');
  });

Js小提琴链接click here