Form Issues (JavaScript)

[Kako]

HTML

<form id="myForm"> <fieldset class="form-group"> <label for="username">Name</label> <input type="text" class="form-control" id="username" placeholder="Enter Name" required> </fieldset> <fieldset class="form-group"> <label for="details">Details</label> <textarea class="form-control" id="details" placeholder="Enter Details" rows="3" required></textarea> </fieldset> <button onclick="buttonFunc()" href="#contact" type="submit" class="btn btn-lg btn-primary-outline hvr-wobble-vertical">Submit</button> </form>

JavaScript

`var name = document.getElementById(‘username’).value;

function buttonFunc() {
console.log(name);
}`

Even with a value in the “username” input, console logs a blank message. I am not sure why this is happening. I am trying to gather the name and details and then the submit button will send me an email with the name and details. They are both stored in a variable. I don’t need to worry about sending the email just yet. Any help is appreciated and thank you for your time!

[Kako]

I fixed it It was a dumb mistake. (I was placing the variable in the wrong scope). Please lock this thread!