Untitled

<!DOCTYPE html>
<html>
<body>

<input type="text" class="class1" jsname="js1" name="john">

<button onclick="myFunction()">Try it</button>
<h1 id="demo">HEAD2</h1>

<script>
function myFunction() {

var parentDOM = document.getElementsByClassName("class1");

var test = parentDOM.getElementsByAttribute("jsname"); // a list of matching elements, *not* the element itself. Tryed getElementById too, but didn't work

var testTarget = parentDOM.getElementsByAttribute("jsname")[0]; // the first element, as we wanted

document.getElementById("demo").innerHTML = testTarget;

</script>

</body>
</html>

<!DOCTYPE html>
<html>
<body>

<input type="text" class="class1" jsname="js1" name="john">

<button onclick="myFunction()">Try it</button>
<h1 id="demo">HEAD2</h1>

<script>
function myFunction() {

var x = document.getElementsByClassName("class1")[0].getAttribute("name");

document.getElementById("demo").innerHTML = x;

</script>