Build a Music Instrument Filter - Step 14

JavaScript
1

Tell us what’s happening:

You should join the array returned by the instrumentCards function. Do not modify your event listener.

Your code so far

<!-- file: index.html -->


/* file: styles.css */


/* file: script.js */
// User Editable Region

function instrumentCards(instrumentCategory) {
  const instruments =
    instrumentCategory === "all"
      ? instrumentsArr
      : instrumentsArr.filter(
          ({ category }) => category === instrumentCategory
        );

  return instruments
    .map(({ instrument, price }) => `
      <div class="card">
        <h2>${instrument}</h2>
        <p>$${price}</p>
      </div>
    `)
    .join(''); 
}


// User Editable Region

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/141.0.0.0 Safari/537.36

Challenge Information:

Build a Music Instrument Filter - Step 14
https://www.freecodecamp.org/learn/full-stack-developer/workshop-music-instrument-filter/step-14

2

Hi @kceeemmanuel01

Here is a comparison of the original code and your code.

The code in blue is the original code, the code in red is your code.
The code in magenta is the overlap.

image
image439×375 13 KB

It looks like you modified code you were not asked to modify.

Please reset the step to restore the seed code and try again.

Happy coding