0

I want to make a div display text when I clicked on it

I have this code and it supposed to make the image inside the "songPlay" div display "demo" text when I clicked it but it doesnt. I dont know anything about js so please help me. Thankyou

This is the code:

<script>

var tag = document.getElementById('demo');

var button = document.querySelector('songPlay');

button.addEventListener('click', function(){

tag.classList.toggle('demo');

});

</script>

<p id='demo'>Audio is playing</p>

<div id="flex-container">

<div id="flex-container2">

<div id="songPlay" onclick="play('song'); toggleText();">

<div class="play1">

<img src="images/play.png" width="15px" height="15px">

</div>

</div>

Eleanor Tran
  • 1
  • 2
  • One, it looks like you are trying to access the elements before they exist - for details, see duplicate. Two, `querySelector` works with CSS selectors. `querySelector('songPlay')` would look for an element with the _tag name_ `songPlay`; you need to prefix that with a `.` if you want to select the first element of a class, or with a `#` if you want to select an element with that ID. – CBroe May 10 '23 at 06:51

0 Answers0