So the reason it's doing this is because we're having it apply the style to this I.D. right, the request id. So it's only recognizing the first one, what we need it to do is have it recognize each one uniquely okay. And then have it manage each one uniquely, and we can really easily do this by basically appending the id of each item onto the ID.

So let's go into our requestsItem.js and let's close the terminal here, and let's go down here and let's say on requests item we just need to get the ID. Now we're passing the ID in so let's say ,_id on this props and then let's change this to a javascript object.

So in back ticks put braces around it and we'll just put that around and put a dash here and then we'll say id, that will make it unique.

requestsItem.js

<div id={'${_id}-requests-item'} className="requests-item'>

Now what we need to do is copy this thing, and go up here and let's replace getElementById request item with that object okay now let's get rid of those braces, and then let's just say this.props._id, okay that will fix the error.

So I just made these two changes this right here on line 24, and this right here on line 55, so that's two changes. Now let's go ahead and go into Chrome and login, let's go to requests and let's try it out. Ok that top one works like always, and now this bottom one works on its own.

So this is all functional and it works fantastic. So let's go ahead and commit our code and then in the next video what we need to do is we need to fix up the header and get it working, so that it's like our design. Our design says welcome Jordan so it just says welcome the name and then it has a different little subtitle.

So we just need to be able to change that, and then we don't want this gray bar when we're in here, because right now we have this gray bar, we don't want to show that, we want to show no gray bar. And we have to add in that log out button which should be really easy.

So basically that's all we have to do and then we'll add in permissions and be done with the application, finally. So let's commit our code.

Terminal

git status
git add .
git commit -m "added unique id for requests item ids for animation background class"

Resources

Source code