Поменять цвет бэкграунда в зависимости от нажатой кнопки на jquery?

Question

[vladimir_html]

https://jsfiddle.net/fgswet01/2/
задача: менять бэкграунд поля в зависимости от нажатой кнопки
В комментарии то, что сделал сам.
Сам никак не соображу, гуглению не поддаётся

Answer 1

[Алекс Арт]

$('.switch').click(function(e) {
		e.preventDefault();
    var color = $(this).data('color');
    $('#viewport').css("background-color", color);
  });

На jQuery. При этом кнопка должна быть такой

<li><button class="switch" data-color="green">Green</button></li>

Comments

[vladimir_html]

а для чего нужен .preventDefault(), не подскажете? Вроде и без него работает

[Алекс Арт]

vladimir_html, если событие .click выполняется на ссылке, или кнопке в форме, то он отменяет стандартное поведение браузера. То есть при клике на ссылку браузер её не откроет, а по кнопке в форме - она не отправится. Вообще в Вашем случае не нужен. Привычка)

Answer 2

[Максим Тимофеев]

https://jsfiddle.net/fgswet01/3/
на заметку:
свойство color меняет цвет шрифта а не бэкграунда

Comments

[Алекс Арт]

Ты серьёзно собрался цвет из текста брать?)

[Максим Тимофеев]

Алекс Арт, ну это же пример, конечно лучше в data атрибут засунуть. Лень дописывать, это же очевидно.