jquery add class on input click и remove class при нажатии другого ввода

Question

Мне нужно добавить класс во входную оболочку, когда я нажимаю на ввод, и удалять класс при щелчке по другому входу.

У меня есть tieed toggleClass, но он будет удалять только класс, когда один и тот же вход снова будет нажат.

Я попытался использовать функции: find() и closeest(), но не могу точно определить, какой из них мне нужен, или в каком порядке они будут называться ... Любая помощь будет оценена.

До сих пор здесь код:

<div class="wrapper"> 
    <label for="name" class="required"> 
     name 
    </label> 
    <div class="data_area"> 
     <input type="text" id="" name="" value="" title="" class="" /> 
    </div> 
</div> 

<div class="wrapper"> 
    <label for="other name" class="required"> 
     last name 
    </label> 
    <div class="data_area"> 
     <input type="text" id="" name="" value="" title="" class="" /> 
    </div> 
</div> 


<script> 
    $('.wrapper input').click(function() { 
     $(this).parent().addClass('red'); 
    }); 
</script> 

<style> 
.red {background:red;} 
</style> 

Answer 1

Я думаю, что вы ищете фокус/размытия, а не нажмите

$('.wrapper input').focus(function() { 
    $(this).parent().addClass('red'); 
}).blur(function() { 
    $(this).parent().removeClass('red'); 
}); 

Демо: Fiddle

Если вы все еще хотите затем нажмите try this