Check out example codes for "how to hide an element in html". It will help you in understanding the concepts better.

Code Example 1

<p hidden>This paragraph should be hidden.</p>

Code Example 2

// javascript
<script>
	document.getElementById("id").style.display = "none";  //hide
	document.getElementById("id").style.display = "block"; //show
	document.getElementById("id").style.display = ""; 	   //show
</script>

// html
<html>
	<div id="id" style="display:none">
    <div id="id" style="display:block">
</html>

// jquery
<script>
	$("#id").hide();      
	$("#id").show();
</script>

Code Example 3

<div id="main"> 
  <p> Hide/show this div </p>
</div>

('#main').hide(); //to hide

// 2nd way, by injecting css using jquery
$("#main").css("display", "none");

Code Example 4

/*Hiding an element can be done by setting the display property to none. 
The element will be hidden, and the page will be displayed as if the element is not there:
Example:
*/

h1.hidden {
  display: none;
}

/*visibility:hidden; also hides an element.
However, the element will still take up the same space as before. 
The element will be hidden, but still affect the layout:
Example:
*/

h1.hidden {
  visibility: hidden;
}

Code Example 5

.classname {
    visibility: hidden;
}

Code Example 6

var link = document.getElementById('nav-ask');
link.style.display = 'none'; //or
link.style.visibility = 'hidden';

Learn ReactJs, React Native from akashmittal.com