JSFiddle - React, Tailwind, and code Playground

by trentHarlem

HTML

<label for="number">number of avocados
<input id="number" type="text" name="number">
</label>
<button id="go">
enter
</button>
<p id="content">

</p>

JavaScript

var myStr = "I bought ";
var myStr2 = " avocados at the store today.";
let num = 0;
var myList = myStr + num + myStr2;
console.log(myList,'before');

go = document.getElementById('go');
go.addEventListener('click', function getNum() {
console.log('click');
input = document.getElementById('number');
num = input.value;
myList = myStr + num + myStr2;
document.getElementById('content').innerHTML = myList;
console.log(myList, 'during');
return myList;
});

console.log(myList,'after');