How do I shorten this code?
https://jsfiddle.net/sf6zdx9p/1/
From lines 9-32 I have conditions for each index of the li that is clicked to either remove or add an active class to that list item as well as the corresponding review in the container above that matches its index. I am looking to shorten that into less code with a function, but I am not sure how.
Edit fiddle - JSFiddle - Code Playground
Test your JavaScript, CSS, HTML or CoffeeScript online with JSFiddle code editor.
3 Replies
i adjusted it a bit.
note. i used the data-active attribute to set an active item (easier to control). so there is a slight change in the html and css as well to account for that
https://jsfiddle.net/markboots/fypz07tv/
Edit fiddle - JSFiddle - Code Playground
Test your JavaScript, CSS, HTML or CoffeeScript online with JSFiddle code editor.
Thank you so much! I appreciate it.
Can you explain why the function works? Is idx something that doesn't need to be declared?
Functions are my biggest weakness in JS. 
the forEach() method has in it's callback function access to the value of each item, but also the index (i called it idx)
ref: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach
so the idx acts here the same as you did with the for loop (the i)