Drum machine fails and feedback

Code Feedback
1

Working on getting the CSS change to trigger with the keydown function, and revert back to its original style after keyup, also I am not passing a couple of the tests and I am not quite sure why. Any feed back or suggestions would be greatly appreciated!

    1. Within #drum-machine I can see 9 clickable “drum pad” elements, each with a class name of “drum-pad”, a unique id that describes the audio clip the drum pad will be set up to trigger, and an inner text that corresponds to one of the following keys on the keyboard: Q, W, E, A, S, D, Z, X, C. The drum pads MUST be in this order.
    1. Within each .drum-pad, there should be an HTML5 <audio> element which has a src attribute pointing to an audio clip, a class name of “clip”, and an id corresponding to the inner text of its parent .drum-pad

project link

2

So the first test is failing because it’s checking the innerText of the .drum-pad elements, and I suspect that isn’t returning what you think it’s returning. Here’s an example, taking one of your actual DOM nodes:

<div class="drum-pad" id="Heater-1.mp3">
  <h1>Q</h1>
  <p>Heater-1</p>
  <audio class="clip" id="Q" src=".../Heater-1.mp3"></audio>
</div>

Now, looking at that, what do you think the innerText is going to return? Is it Q? or is it QHeater-1?

Edit: And the issue with the second test? Exactly the same problem.

3

thank you! such a simple thing

4

Is it working? Because I just see a blank page :neutral_face: