동적으로 CSS 변경

Question

나는 5x5 상자의 매트릭스를 만들었습니다. 링크를 클릭하고 해당 링크를 클릭 한 후 동적으로 색상을 변경하고 싶습니다 (한 번에 하나씩) - 한 번에 하나씩. 그러나 현재 코드에서는 클릭 한 특정 링크가 아닌 모든 링크로 색상이 변경됩니다.

HTML :

<ul id="rowOne" class="center"> 
    <li><a href="#">$100</a></li> 
    <li><a href="#">$100</a></li> 
    <li><a href="#">$100</a></li> 
    <li><a href="#">$100</a></li> 
    <li><a href="#">$100</a></li> 
</ul> 

JQuery와 :

$('a').click(function(){ 
$.each('a').css({'color':'#002290'}); 
}); 

어떤 제안이?

Answer 1

당신은이 작업을 수행 할 필요가 -

$('a').click(function(){ 
    $(this).css({'color':'#002290'}); 
}); 

Answer 2

코드는 "어떤 <a>을 클릭하면, <a> 모든 이상 요소 ($.each...)를 반복하고 자신의 CSS를 변경"말했다. 당신은 jQuery의 이벤트 콜백에서 this를 통해 사용할 수있는 클릭 요소에 변경 사항을 적용해야합니다 (객체를 구축 할 때 당신은 또한 키 주변 (color를) 인용 부호를 생략 할 수 있습니다

$('a').click(function(){ 
    $(this).css({'color':'#002290'}); 
}); 

재산 아무튼 경우 '는 t는 ...)

$(this).css({color: '#002290'}); 

를 하이픈을 포함 ... 또는 하나의 속성을 설정하는 객체를 완전히 생략하고 두 개의 분리 된 문자열 매개 변수로 이름과 값을 전달 :

$(this).css('color', '#002290'); 

Answer 3

a 태그를 다시 변경 하시려면 .Dont 클릭하기 전에 모든 태그 색상을 제거하지 마십시오. .

$('a').click(function(){  
    $('a').css('color', '');   
    $(this).css({'color':'#002290'}); //current tag 
});