claraj · September 14, 2017 12:15
diff --git a/randomcolor.html b/randomcolor.html

 <!DOCTYPE html>
 <html lang="en">
 <head>
  <meta charset="UTF-8">
  <title>Colors</title>
  <style>
    #randomColor {
      height : 200px;
      width : 300px;
      font-size: 20px;
    }

  </style>


 </head>
 <body>

 <!--Can provide arguments to JavaScript functions when called from code
 The argument "this" sends this element as an argument - in this case, the
 button elements sends itself as an argument. -->
 <p id="samplecolor"><b>PARAGRAPH PARAGRAPH PARAGRAPH PARAGRAPH PARAGRAPH<br>
  PARAGRAPH PARAGRAPH PARAGRAPH PARAGRAPH PARAGRAPH<br>
  PARAGRAPH PARAGRAPH PARAGRAPH PARAGRAPH PARAGRAPH<br>
  PARAGRAPH PARAGRAPH PARAGRAPH PARAGRAPH PARAGRAPH<br>
  PARAGRAPH PARAGRAPH PARAGRAPH PARAGRAPH PARAGRAPH</b></p>


 <button id='randomColor'>Click for Random Color</button>
 <button id='addColor'>Save Random Color to Table</button>

 <script>

  changeToRandomColor();

  var randomColor_button = document.getElementById("randomColor");
  randomColor_button.addEventListener("click", changeToRandomColor);

  var mycolor_button = document.getElementById("addColor");
  mycolor_button.addEventListener("click", addtoTable);


  function addtoTable() {
    var currentColor = document.getElementById('samplecolor').style.color;
    console.log('Current color = ', currentColor);

    var newRow = document.createElement("tr");

    newRow.innerHTML = "<td>" + currentColor + "</td>" + "<td style='color:" + currentColor + "'>sample text</td>";

    var tableElement = document.getElementById("myTable");

    tableElement.appendChild(newRow);


  }

  //function saveFunction() [
  // var x = document.createElement("INPUT");
  // x.setAttribute("type","color");
  // document.body.appendChild(x);


  function changeToRandomColor() {
    //element.style.backgroundColor = randomColor();
    var allPara = document.getElementsByTagName("p");
    //Loop over the array, and set the style's color to green
    for (var p = 0 ; p < allPara.length ; p++) {
      allPara[p].style.color=randomColor();
    }


  }
  function randomColor() {
    var r = Math.floor(Math.random() * 255);   //Pick a random number between 0 and 1
    var g = Math.floor(Math.random() * 255);   //Multiply by 255 to get a number in the correct range
    var b = Math.floor(Math.random() * 255);   //Then convert it to an int
    //Colors can be created as "rgb(33, 52, 15)" where the numbers are R, G, B values.
    //This is expected as a string.
    var hexColor = "rgb(" + r + ", " + g + ", " + b + ")";
    //console.log(hexColor);
    return hexColor.toUpperCase();

    var answerSpan = document.getElementById("answer");
    answerSpan.innerHTML = answer;

    var hexr = r.toString(16);
    var hexg = r.toString(16);
    var hexb = r.toString(16);

    if (hexr.length == 1) {
      hexr = "0" + hexr;
    }

    if (hexg.length == 1) {
      hexg = "0" + hexg;
    }

    if (hexb.length == 1) {
      hexb = "0" + hexb;
    }

    var hexColor = "#" + hexr + hexg + hexb;
    console.log(hexColor);
    return hexColor.toUpperCase();
  }


  function color (randomColor) {
    color.toHexString();
  }

 </script>
 <p>


  <table id="myTable" border=5 cellpadding ="5">
    <tr>
      <th style="width:130px" align="left">Background Color</th>
      <th style="width:130px" align="left">Hex Value</th></tr>
    <tr><td><p><span id="answer">'randomColor2'</span></p></td><td></td></tr>
 <tr><td>--</td><td>--</td></tr>
 </table>


 </body>

	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<title>Colors</title>
	<style>
	#randomColor {
	height : 200px;
	width : 300px;
	font-size: 20px;
	}

	</style>


	</head>
	<body>

	<!--Can provide arguments to JavaScript functions when called from code
	The argument "this" sends this element as an argument - in this case, the
	button elements sends itself as an argument. -->
	<p id="samplecolor"><b>PARAGRAPH PARAGRAPH PARAGRAPH PARAGRAPH PARAGRAPH<br>
	PARAGRAPH PARAGRAPH PARAGRAPH PARAGRAPH PARAGRAPH<br>
	PARAGRAPH PARAGRAPH PARAGRAPH PARAGRAPH PARAGRAPH<br>
	PARAGRAPH PARAGRAPH PARAGRAPH PARAGRAPH PARAGRAPH<br>
	PARAGRAPH PARAGRAPH PARAGRAPH PARAGRAPH PARAGRAPH</b></p>


	<button id='randomColor'>Click for Random Color</button>
	<button id='addColor'>Save Random Color to Table</button>

	<script>

	changeToRandomColor();

	var randomColor_button = document.getElementById("randomColor");
	randomColor_button.addEventListener("click", changeToRandomColor);

	var mycolor_button = document.getElementById("addColor");
	mycolor_button.addEventListener("click", addtoTable);


	function addtoTable() {
	var currentColor = document.getElementById('samplecolor').style.color;
	console.log('Current color = ', currentColor);

	var newRow = document.createElement("tr");

	newRow.innerHTML = "<td>" + currentColor + "</td>" + "<td style='color:" + currentColor + "'>sample text</td>";

	var tableElement = document.getElementById("myTable");

	tableElement.appendChild(newRow);


	}

	//function saveFunction() [
	// var x = document.createElement("INPUT");
	// x.setAttribute("type","color");
	// document.body.appendChild(x);


	function changeToRandomColor() {
	//element.style.backgroundColor = randomColor();
	var allPara = document.getElementsByTagName("p");
	//Loop over the array, and set the style's color to green
	for (var p = 0 ; p < allPara.length ; p++) {
	allPara[p].style.color=randomColor();
	}


	}
	function randomColor() {
	var r = Math.floor(Math.random() * 255); //Pick a random number between 0 and 1
	var g = Math.floor(Math.random() * 255); //Multiply by 255 to get a number in the correct range
	var b = Math.floor(Math.random() * 255); //Then convert it to an int
	//Colors can be created as "rgb(33, 52, 15)" where the numbers are R, G, B values.
	//This is expected as a string.
	var hexColor = "rgb(" + r + ", " + g + ", " + b + ")";
	//console.log(hexColor);
	return hexColor.toUpperCase();

	var answerSpan = document.getElementById("answer");
	answerSpan.innerHTML = answer;

	var hexr = r.toString(16);
	var hexg = r.toString(16);
	var hexb = r.toString(16);

	if (hexr.length == 1) {
	hexr = "0" + hexr;
	}

	if (hexg.length == 1) {
	hexg = "0" + hexg;
	}

	if (hexb.length == 1) {
	hexb = "0" + hexb;
	}

	var hexColor = "#" + hexr + hexg + hexb;
	console.log(hexColor);
	return hexColor.toUpperCase();
	}


	function color (randomColor) {
	color.toHexString();
	}

	</script>
	<p>


	<table id="myTable" border=5 cellpadding ="5">
	<tr>
	<th style="width:130px" align="left">Background Color</th>
	<th style="width:130px" align="left">Hex Value</th></tr>
	<tr><td><p><span id="answer">'randomColor2'</span></p></td><td></td></tr>
	<tr><td>--</td><td>--</td></tr>
	</table>


	</body>