购物网站中，选择不同颜色和尺寸时，相应地方的文字也跟着改变

<div class="colors">
<strong>颜色：</strong> <span> 蓝白</span>
</div>
<div class="colorimg">
<ul>
<li><img src="images/pro_img/blue.jpg" alt="蓝白" /></li>
<li><img src="images/pro_img/yellow.jpg" alt="黄白" /></li>
<li><img src="images/pro_img/green.jpg" alt="绿白" /></li>
</ul>
</div><!--选择不同颜色-->
<div class="size">
<strong>尺寸：</strong> <span> 未选择 </span>
</div>
<div class="sizetype">
<ul>
<li>S</li>
<li>L</li>
<li>SL</li>
<li>LL</li>
</ul>
</div><!--选择不同尺寸-->

$(function() {
var color_list=$(".colorimg ul li img");
color_list.click(function(){
var text=$(this).attr("alt");
$(".colors span").html(text);
});//选择不同颜色时，文字跟着变化

var size_list=$(".sizetype ul li");
size_list.click(function(){
var text=$(this).html();
$(".size span").html(text);
});//选择不同尺寸时，文字跟着变化
});

其中attr()

attr(属性名)

attr(属性名，属性值)