Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial![](https://ecs-static.teamtreehouse.com/assets/views/marketing/shared/community-banner-white-47072046c51352fe6a69f5e691ff5700b28bb11d45197d7bdf066d9ea3f72d0c.webp)
![Doron Geyer](https://uploads.teamtreehouse.com/production/profile-photos/10694062/micro_0.jpg)
Doron Geyer
Full Stack JavaScript Techdegree Student 13,897 Points2 different approaches not sure why one doesnt work. else if vs if.
so basically I have been trying to nest multiple else if statements to make this work. in my code below you can see the last else if is commented out. I have turned it into an if statement to test.
listUL.addEventListener('click', (event) => {
if(event.target.tagName == 'BUTTON'){
if (event.target.className == 'remove') {
let li = event.target.parentNode;
let ul = li.parentNode;
ul.removeChild(li);
}else if(event.target.className == 'up'){
let li = event.target.parentNode;
let ul = li.parentNode;
if(li.previousElementSibling){
ul.insertBefore(li,li.previousElementSibling);
}
// }else if(event.target.className == 'down'){
// let li = event.target.parentNode;
// let nextLi= li.nextElementSibling;
// let ul = li.parentNode;
// if(nextLi){
// ul.insertBefore(nextLi,li);
// }
}
if(event.target.className == 'down'){
let li = event.target.parentNode;
let nextLi= li.nextElementSibling;
let ul = li.parentNode;
if(nextLi){
ul.insertBefore(nextLi,li);
}
}
}
});
basically if its nested as a second else if it doesnt work. If I have it as a stand alone if statement then it works just fine. No changes to the actual if conditions etc. Copy paste.
can someone tell me why it wouldnt work with the last button listed as another else if?
3 Answers
![Steven Parker](https://uploads.teamtreehouse.com/production/profile-photos/969492/micro_tool_chess_set_2.jpg)
Steven Parker
230,688 PointsWhen you have two "if" statements in series, they will both run when their conditional expressions are true.
But when the second one is "else if", it will only run when the first expression is false (and its own expression is true).
![<noob />](https://uploads.teamtreehouse.com/production/profile-photos/10467642/micro_205-2059901_patrick-star-majin-buu.jpg)
<noob />
17,062 PointsIt should work, but ur syntax isn't ok. basically you want to use "if" for ur first if statement and "else if" for the other option and "else" if nothing has been met this is the structure try to modify it like so:
if(something) {
} else if(something) {
} else if(something) {
} else {
}
![Doron Geyer](https://uploads.teamtreehouse.com/production/profile-photos/10694062/micro_0.jpg)
Doron Geyer
Full Stack JavaScript Techdegree Student 13,897 PointsThanks for the response, but you dont necessarily need to end the else if chain with an else statement. It only needs to end on "else" if you require the code to do something should none of the conditions be met. If you exclude the else it just wont do anything if the initial if/else if conditions arent met.
so if(){
//
}else if(){
//
}else if(){
//
};
should work just fine.
heres a link where its discussed https://stackoverflow.com/questions/38536554/do-i-need-a-last-else-clause-in-an-if-else-if-statement
so there must be something else I have overlooked somewhere.
![<noob />](https://uploads.teamtreehouse.com/production/profile-photos/10467642/micro_205-2059901_patrick-star-majin-buu.jpg)
<noob />
17,062 PointsYou are correct about that
in order to help u i need a snapshot of the workspace :], it has to do with the identation or something simple.
![Doron Geyer](https://uploads.teamtreehouse.com/production/profile-photos/10694062/micro_0.jpg)
Doron Geyer
Full Stack JavaScript Techdegree Student 13,897 Pointsheres a copy of the snapshot, unfortunately I already deleted the code but what I posted above was copy pasted out.
Doron Geyer
Full Stack JavaScript Techdegree Student 13,897 PointsDoron Geyer
Full Stack JavaScript Techdegree Student 13,897 PointsOK I get what you saying, but in my use case should it not still work? I mean its 3 distinct click events that will respond only if their specific button is clicked.
Steven Parker
230,688 PointsSteven Parker
230,688 PointsSure, since these are mutually exclusive tests it should indeed work.
So I tried your snapshot, and I did not see any difference in behavior when I added "else" in front of the last if.
Doron Geyer
Full Stack JavaScript Techdegree Student 13,897 PointsDoron Geyer
Full Stack JavaScript Techdegree Student 13,897 Pointsok weird, maybe im just having issues on my end thanks for the feedback , going to restart browsers etc.
<noob />
17,062 Points<noob />
17,062 PointsI dont quite understand the last sentence, what do u mean by : it will only run when the first expression is false (and its own expression is true)
Doron Geyer
Full Stack JavaScript Techdegree Student 13,897 PointsDoron Geyer
Full Stack JavaScript Techdegree Student 13,897 Points<noob /> all that Steven parker is saying in his comment
the
part will only run when the
condition fails and the condition in the else if is true. when the if block is true it wont run.
when you have 2 if statements following each other
even if the first one is true the second one will still run.
Steven Parker
230,688 PointsSteven Parker
230,688 PointsBy "its own" I mean the second one: