Добавить элемент для изменения с существующим onblur

Question

Я бы хотел, чтобы отдельный DIV, содержащий данные, также менял цвет фона. Как бы я добавил его в мой существующий код, который работает?

<script type="text/javascript">
jQuery(document).ready(function() {
jQuery("input:[type=text]").focus(function () {
 jQuery(this).addClass("highLightInput");

});
jQuery("input:[type=text]").blur(function () {
jQuery(this).removeClass("highLightInput");
});
    });
 </script>

Answer 1

<script type="text/javascript">
$(document).ready(function() {
$("input:[type=text]").focus(function () {
 $(this).addClass("highLightInput");
$(this).parent('div').addClass('highlight');

});
$("input:[type=text]").blur(function () {
$(this).removeClass("highLightInput");
$(this).parent('div').removeClass('highlight');
});
    });
 </script>

Answer 2

Хватит возиться с JavaScript за то, что можно решить с помощью CSS. Единственным ограничением является то, что он не будет поддерживать IE6 / 7

textarea.yourClass {
    width: 100%; 
    background: white url('iamges/img.png') no-repeat 50% 50%; 
    color: grey;
}
textarea.yourClass:focus {
    color: #444; 
    background: none;
}

Если вам нужно поддерживать IE6 / 7, используйте вышеуказанные методы JS