Как добавить и удалить имя класса из ссылки при нажатии?

Question

Я хочу переключить видимость 2 ссылок (send_email и email_sent) в таблице в моем приложении rails. Обе ссылки находятся в одной ячейке.

<table > 
<% @applications.each do |application| %> 
<tr> 
    <td> 
    <a href="mailto:grant@example.com" class="send_email">Invite for an interview</a> 

    <a href="" class="email_sent hidden">Undo</a> 
    </td> 
</tr> 
<% end %> 
</table> 

В моей CSS У меня есть

.hidden{display: none;} 

Вот мой Javascript

<%= javascript_tag do %> 
$(function(){ 
    $('.send_email > a').click(function(){ 
    // add the hidden class to send_email 
    // remove the hidden class from the next email_sent link 
    }); 
    $('.email_sent > a').click(function(){ 
    // add the hidden class to email_sent 
    // remove the hidden class from the previous sent_email link 
    }); 
}); 
<% end %> 

Answer 1

Вы делаете это неправильно. $('.send_email > a') означает, что у вас есть класс send_email родительскому элементу якоря. $('a.send_email') - это правильный способ выбора якоря с классом.

Я хотел бы использовать hide(), show() так:

$('a.send_email').click(function(){ 
    $(this).hide(); 
    $('.email_sent').show(); 
}); 

$('a.email_sent').click(function(){ 
    $(this).hide(); 
    $('.send_email').show(); 
}); 

Answer 2

Вы можете просто использовать removeClass()addClass() и с Jquery.

Remove Class docs.

Add Class docs.