<style type="text/css">
.css_test {
background : #efefef;
border-radius : 5px;
border : 5px solid gray;
}
.css_test div {
background : #fff;
border-radius : 5px;
margin : 10px;
padding : 10px;
}
</style>
버튼을 눌러보세용<br><br>
<button type="button"
onclick="j_test_fc()">first-child 는 봅니다</button>
<button type="button"
onclick="j_test_f()">first 는 봅니다</button>
<div class="css_test">
<div>
<img src="//superkts.com/img/huk1.gif" />
<img src="//superkts.com/img/huk1.gif" />
<img src="//superkts.com/img/huk1.gif" />
<img src="//superkts.com/img/huk1.gif" />
</div>
<div>
<img src="//superkts.com/img/huk1.gif" />
<img src="//superkts.com/img/huk1.gif" />
<img src="//superkts.com/img/huk1.gif" />
<img src="//superkts.com/img/huk1.gif" />
</div>
<div>
<img src="//superkts.com/img/huk1.gif" />
<img src="//superkts.com/img/huk1.gif" />
<img src="//superkts.com/img/huk1.gif" />
<img src="//superkts.com/img/huk1.gif" />
</div>
</div>
<script type="text/javascript">
function j_test_fc(){
$('.css_test div img:first-child').attr('src', '//superkts.com/img/huk2.gif');
setTimeout(function(){
$('.css_test img').attr('src', '//superkts.com/img/huk1.gif');
}, 500);
}
function j_test_f(){
$('.css_test div img:first').attr('src', '//superkts.com/img/huk2.gif');
setTimeout(function(){
$('.css_test img').attr('src', '//superkts.com/img/huk1.gif');
}, 500);
}
</script>