用JQUERY如何给LI加ID并判断当前LI里有几个图片

结构是这个样的：

<div class="box">
    <ul class="item">
        <li>
            <div class="content">
                <img src="nopic.jpg" />
            </div>
        </li>
        <li>
            <div class="content">
                <img src="nopic.jpg" />
                <img src="nopic.jpg" />
            </div>
        </li>
        <li>
            <div class="content">
                <img src="nopic.jpg" />
                <img src="nopic.jpg" />
                <img src="nopic.jpg" />
            </div>
        </li>
    </ul>
</div>

LI的数量N多，里面图片也是不固定数量，但最多如何只限制显示三个多出来的不显示，然后就是如何给每个LI加上固定id="ID1", "ID2", "ID3"以此类推，并判断LI里有多少张图片，并给图片加上样式呢？怎样用JQUERY解决呢？求解，先谢谢啦！~

---

感觉越写越乱了。。。
<style>
li{

list-style-type:none;

}
img{

background-color: red;
height: 10px;

}
.num1 img{

width: 100%;

}
.num2 img{

width: 40%;

}
.num3 img{

width: 30%;

}
.hidden{

display: none;

}
</style>
<script>
var a = 1;
$("li").each(function () {

$(this).attr("id", "ID" + a++);
var num = $(this).find("img").each(function(i){
  if(i>2){
    $(this).addClass("hidden");
  }
}).length;
num = num>3 ? 3 : num;
$(this).addClass('num'+num);

});

</script>

---

$('div.box ul.item li').each(function(index){
    $(this).attr('id',"ID"+index);
    $(this).find('img').css({
    //你的图片样式
    });
});