javascript else if

Javascript else if is a conditional statement, which is used to get results according to the different conditions. There are 2 types of conditional statement, like if you have only one condition then you can use “if statement” for that, and if you have more than one condition then you can use “else if statement”. Let’s know how to use if else in Javascript.

<script>

	var color = "red";
         
	if( color == "red" ) {
	   alert('Yes, color is red');
	}
	
</script>
	
/ ***** If the condition is false ***** /

<script>

	var color = "red";
         
	if( color == "pink" ) {
	   alert('Yes, color is red');
	}else{
		alert('No, color is not red');
	}
	
</script>

Javascript Else If Syntax

Before using else if statement you must know about its syntax. The following 3 examples are given below, after seeing which you will find out how you can use javascript if else condition.

/ ***** This is "If" condition ***** /

if (condition) {
	This statement will work if your condition is true 
}

/ ***** This is "Else" condition ***** /

if (condition) {
	This statement will work if your condition is true 
}
else{
	This statement will work if your condition is false
}

/ ***** This is "Else If" condition ***** /

if (condition-1) {
	This statement will work if your condition-1 is true 
}
else if (condition-2){
	This statement will work if condition-1 is false
}
else{
	This statement will work if both condition-1 & condition-2 is false
}

Javascript Else If Statement

If you have more than one condition, then you will have to use javascript else if statement. Let’s know how to use if condition in javascript

<script>

	var age = 20;
	
	if( age == 30 ) {
	   document.write("Age is 30");
	} 
	else if( age == 20 ) {
	   document.write("Age is 20");
	} 
	else if( age == 10 ) {
	   document.write("Age is 10");
	} 
	else {
	   document.write("Age is wrong");
	}
	
</script>

Output:- Age is 20


/ ***** Get Alert ***** /

<script>

	var day = "sunday";
	
	if( day == "monday" ) {
	   alert("Today is monday");
	} 
	else if( day == "sunday" ) {
	   alert("Today is sunday");
	}
	else {
	   alert("nothing");
	}
	
</script>

Output:- Today is Sunday


/ ***** Checking salary greater than 80 ***** /

<script>

	var salary = 100;
	var result;
	
	if( salary > 80 ) {
	   result = " I am happy";
	}
	else {
	   result = " I am sad";
	}
	document.write(result);
</script>

Output:- I am happy


/ ***** Checking salary less than 80 ***** /

<script>

	var salary = 100;
	var result;
	
	if( salary < 80 ) {
	   result = "I am happy";
	}
	else {
	   result = "I am sad";
	}
	document.write(result);
</script>

Output:- I am sad

Javascript Else If Onclick

<button onclick="conditionfunction()">Click Me</button>

<p id="payment"></p>

<script>
function conditionfunction() {
	var salary = 100;
	var result;
	
	if( salary == 80 ) {
	   result = "I am sad";
	}
	else if (salary == 100){
	   result = "I am very happy";
	}
	else{
		result = "This is wrong";
	}
	document.getElementById("payment").innerHTML = result;
}
</script>

Output:- I am very happy


/ ***** Checking Day ***** /

<button onclick="conditionfunction()">Click me</button>

<p id="payment"></p>

<script>
function conditionfunction() {
	var day = "sunday";
	var result;
	
	if( day == "friday" ) {
	   result = "Today is friday";
	}
	else if( day == "sunday" ){
	   result = "Today is Sunday";
	}
	else{
	   result = "Bad day";
	}
	document.getElementById("payment").innerHTML = result;
}
</script>

Output:- Today is Sunday


/ ***** Get Alert Onclick ***** /

<button onclick="conditionfunction()">Click me</button>

<script>
function conditionfunction() {
	var age = 20;
	var result;
	
	if( age == 22 ) {
	   result = "I am 22";
	}
	else if( age == 20 ){
	   result = "I am 20";
	}
	else{
	   result = "wrong";
	}
	alert(result);
}
</script>

Output:- I am 20


/ ***** Using not is equal to condition ***** /

<button onclick="conditionfunction()">Try it</button>

<script>
function conditionfunction() {
	var age = 20;
	var result;
	
	if( age != 20 ) {
	   result = "Age is not 20";
	}
	else{
	   result = "Yes, i am 20";
	}
	alert(result);
}
</script>

Output:- Yes, i am 20

Browser Support

  • Edge
  • Firefox
  • Internet Explorer
  • Opera
  • Safari
  • Chrome

Frequently Asked Questions

We have answers to some questions that people search on the Internet everyday. Let us know what are those questions and what are their answers.

How do I link CSS to HTML?
To link CSS with html, you can place your file inside the head tag. For example link rel = “stylesheet” href = “mystyle.css”

How do you put a full background image on HTML?
If you want to apply the full background image, then you can apply the image above your body tag. for example Background-image: url (“myimage.jpg”).

What is div in HTML?
In simple language, div is a box inside which you set your elements.

How do you underline in HTML?
With the u tag you can underline your text.

Where do I put CSS in HTML?
There are 3 ways to apply CSS, either you can link your file inside the head tag, or you can add inline CSS, or you can place your CSS on the same page with the style tag.

Note: All the examples you have seen inside this article have all been made by us and tested thoroughly. So you can use all these without any difficulty.