It is very difficult to change an external style sheet with JavaScript.  Thankfully internal styles are easy and they override what is in an external style sheet anyway.

Open idclass.html in your editor and save it as jsstyle.html.

Add an onmouseup event trigger to the final paragraph opening tag:

<p class="bye" onmouseup="document.getElementById('hello').style.display='none';">

Save and try in a browser and when you click on the final paragraph the second DIV should vanish as you have set it's in-line style display to none.

You can change any other style like this.  Be aware that if the CSS is in two parts (like background-color) JavaScript will normally used backgroundColor).  Replace display in the new code with backgroundColor and none with red;