P@P - JS change background

Javascript event to change a div bg based on a radio button selection

by Tiago Sousa

HTML

<div id="my_wrapper">
  <div class="checkbox-item">
    <input type="radio" onclick="javascript:change_checkbox_color('000000');" name="div_color"> Black
  </div>
  <div class="checkbox-item">
    <input type="radio" onclick="javascript:change_checkbox_color('ffffff');" name="div_color"> White
  </div>
  <div class="checkbox-item">
    <input type="radio" onclick="javascript:change_checkbox_color('0000ff');" name="div_color"> Blue
  </div>
  <div class="checkbox-item">
    <input type="radio" onclick="javascript:change_checkbox_color('ff0000');" name="div_color"> Red
  </div>
  <div class="checkbox-item">
    <input type="radio" onclick="javascript:change_checkbox_color('00ff00');" name="div_color"> Green
  </div>

</div>

CSS

#my_wrapper {
  background: #cc0000;
  color: #dddddd;
}

JavaScript

function change_checkbox_color(color_value) {
  var my_div = document.getElementById('my_wrapper');
  my_div.style.background = "#" + color_value;
}