jquery and the dom

by Brian Chang

HTML

<body>

    <div class='inverseDiv'>
    <h1>random text random text</h1>
    </div>

    <div class='inverseDiv'>
    Soccer is my favorite sport<br>
    </div>

    <div class='inverseDiv'>
    <h1>I like to eat hamburgers</h1>
    <p>blah blah blah</p>
    </div>
 
    <div class='inverseDiv'>
	<input type="button" class="btn btn-inverter" value="Click to change font color" id="myButton">
    </div>

    </body>

JavaScript

function randomColor() {
    var hexValues = '0123456789ABCDEF'.split('');
    var startColor = '#';
    for (var i = 0; i < 6; i++ ) {
        startColor += hexValues[Math.round(Math.random() * 15)];
    }
    return startColor;
}

$(function() {
    $(".inverseDiv").each(function() {
        $(this).css("background-color", randomColor());
    });
});

$(document).ready(function(){
  $('#myButton').click(function invertColor(hexTripletColor) {

var color = hexTripletColor;

color = color.substring(1); // remove #

color = parseInt(color, 16); // convert to integer

color = 0xFFFFFF ^ color; // invert three bytes

color = color.toString(16); // convert to hex

color = ("000000" + color).slice(-6); // pad with leading zeros

color = "#" + color; // prepend #

return color;
	}); 
});