-3

I have View code like this

<div class="activeQue" style="font-size:20px;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);">email[i].Question1</div>
<div class="hiddenQue" style="font-size:20px;" >email[i].Question2  </div> 
<div class="hiddenQue" style="font-size:20px;" >  email[i].Question3  </div>
<div class="hiddenQue" style="font-size:20px;" >  email[i].Question4 </div>
<div class="hiddenQue" style="font-size:20px;" >  email[i].Question5 </div>
<div class="hiddenQue" style="font-size:20px;" >  email[i].Question6 </div>
<div class="hiddenQue" style="font-size:20px;" >  email[i].Question7 </div>
<div class="hiddenQue" style="font-size:20px;" >  email[i].Question8 </div>
<div class="hiddenQue" style="font-size:20px;" >  email[i].Question9 </div>
<div class="hiddenQue" style="font-size:20px;" >  email[i].Question10 </div>
<button id="mylink" >next</button>

And JS code like this

var myLink = document.getElementById('mylink');
myLink.onclick = function functionName(){
    var element = $(".activeQue");
    $(element).removeClass("activeQue").addClass("hiddenQue");
    $(element).next().addClass("activeQue");
}

But I have error like this

$ is not defined at HTMLButtonElement.functionName

How I can solve it?

M Hamza Javed
  • 1,269
  • 4
  • 17
  • 31
Eugene
  • 219
  • 2
  • 14

1 Answers1

2

The jQuery library is a single JavaScript file, and you reference it with the HTML tag (notice that the tag should be inside the section):

<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
</head>
Taras Kovalenko
  • 2,323
  • 3
  • 24
  • 49