동적 버튼의 CSS 변경

Question

나는 따라 잡고 경고를 할 수 있습니다. 선택한 버튼의 클래스를 어떻게 변경합니까?

$('body').on("click", "button[name=likebtn]", function(){ 
    alert($(this).attr("value")); 

    $(this).toggleClass('btn btn-mini likebtn'); 
// OR 

    $(this).addClass('btn btn-mini likebtn').removeClass('btn btn-mini btn-primary likebtn'); 
}); 

버튼은 동적으로 출력됩니다 :

$('#div').append("<button class='btn btn-mini btn-primary likebtn' name='likebtn' type='button' value='"+obj.value+"'>"+"LIKE"+"</button>"); 

내가 시도 다음했지만 실패 : 당신에 의해 btn btn-mini likebtn를 추가하기 때문에

이

Answer 1

어쩌면 당신은 addClass()

$(this).removeClass('btn-primary').addClass('btn btn-mini likebtn'); 

전에 removeClass()를 사용한다 .addClass('btn btn-mini likebtn') 그리고 나서 당신은 r .removeClass('btn btn-mini btn-primary likebtn');

편집를 호출하여 가져 가십시오 : 제거 할 경우에만 btn-primary 클래스 :

$('button[name=likebtn]').on("click", function(){ 
// ... 
$(this).removeClass('btn-primary'); 
}); 

Answer 2

당신은 당신이 다시 코드 아래

$('body').on("click", "button[name=likebtn]", function(){ 
    alert($(this).attr("value")); 

    $(this).toggleClass('btn-primary'); 

}); 

Answer 3

을 실행해야 몸에 버튼을 추가하는 경우 이미 'btn-primary'클래스를 버튼에 추가했기를 바랍니다. 그리고 그냥 'btn btn-mini likebtn'클래스를 추가하고 'btn-primary'클래스를 제거해야합니다. 그런 다음 아래에서 시도하십시오.

$(this).addClass('btn btn-mini likebtn').removeClass('btn-primary');