Изменить класс div, но не промежуток в нем

Question

У меня есть <div> с серой рамкой, которую я использую в качестве кнопки.

Я использую jQuery, чтобы изменить цвет границы на черный, когда я переворачиваю его (изменяя класс css на mouseover). в <div> также есть <span> с моим текстом кнопки.

Беда в том, что когда я переворачиваю текст, который тоже получает информацию об изменении класса CSS, у моего текста появляется черная рамка.

Я хочу знать, есть ли способ для javascript или jQuery игнорировать <span> текст и относиться к нему, как будто его не было.

Я просто хочу, чтобы цвет рамки кнопки менялся, а также не добавлял рамку к моему тексту.

Любая помощь приветствуется!

Answer 1

Кажется, что ваш селектор, когда вы применяете новый стиль, неверен и включает в себя содержимое диапазона тоже.

Но для изменения косметики мыши над событием, пожалуйста, используйте способ CSS:) Много чище.

.myClass
{
  // css of the button
}
.myClass:hover
{
  // css of the button when mouse over it.
}

Answer 2

Как сказал @Jean-Philippe, jQuery для этого не нужен, css содержит все функции, необходимые для изменения внешнего вида элемента при наведении на него курсора.

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

Этот jsfiddle демонстрирует оба метода, а также не ставит границу внутреннего диапазона