<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
<style>
img{width:100px; height:100px;}
.c1{border:5px solid red; }
.c2{border:5px dotted green; }
.c3{border:5px solid blue; }
.c4{border:5px solid pinks; }
</style>
</head>
<body>
<div>
이름: <input type="" name="username" id="username" value="홍길동"/>
연락처: <input type="" name="tel" id="tel" />
<textarea id="intro" cols="50" row="3"></textarea>
</div>
<div></div>
<img src="../img/swisda.jpg" />
<img src="../img/swisda.jpg" />
<img src="../img/swisda.jpg" />
<img src="../img/swisda.jpg" />
<script>
$(function(){
$("img").addClass('c1');
$("img").addClass('c2');
$("img").eq(2).addClass('c3');
$("img").removeClass("c2");
$("img:even").addClass("c3");
$("img:odd").addClass("c4");
$("img").removeClass("c1");
$("img").toggleClass("c3")
var q = $("img").hasClass('c3')
$('#tel').val(q)
$('#intro').val($("#username").val())
})
</script>
</body>
</html>
클래스 추가 및 제거 결과
화면 결과