JSFiddle - React, Tailwind, and code Playground

by Peyton Hessler

HTML

Index:
<input type="textbox" id="index" value = "2"/>
<br/> Value:
<input type ="textbox" id="value" value="10"/>
<br/>
<input type ="button" value="Create Array" onClick="fillArray();"/>
<br/>
<input type ="button" value="Insert into Array" onclick="insertIntoArray();" />
<br/>
<div id="output">

</div>

JavaScript

var array = []; // Global array to hold array
var d = ""; // Global string for output

function fillArray() 
{
// call function to clear the display
clearDispaly();

// A loop created to set array values from 1 to 100 in a random fashion.
for(var i = 0; i < 100; i++)
	{
	array[i] = Math.floor(Math.random() * 100 +1);
	}
	// Call the function to display the array.
	displayArray(;)
}

// Below is the function used to clear the array.
function cleardisplay()
{
	// Global string d is used to hold display.
d = "";
// the div element named output is used to display output.
document.getElementById("output").innerHTML = "";
}

// Below is the code used to display the array that was created in fillArray
function displayArray()
{
// Loop used to add values to string d
for (var i = 0; i < array.length - 1; i++) 
{
	d += i + ' :' + array[i]
 + "<br/>;
}
	document.getElementById("output").innerHTML = d;
}

function insertIntoArray() 
{
	cleardisplay();
  // Get value of index of value to insert
  var i = parseint(document.getElementById("index").value);
  
d = "inserting " + v + " at " + i + "<br/>";


displayArray();
}