Removing H2 Text from Syllabus

[kevinw]

I'm trying to modify the CSS on the syllabus page to hide the assignments. 

I was able to use some CSS to block the listing of them all so that only the "course description" remained. But now I am plagued by this little guy:

It's just H2 text that is non-editable through the Rich Content Editor. 

Does anyone have any idea or suggestion on how to make this disappear? 

[themidiman]

I might suggest that you be very careful with this, as there could be elements created by the Syllabus Description RCE that are also H2 level semantic elements. 

But if you want to do this from the Developer Console as a proof of concept here are the lines of JavaScript that got it to work for me:

//Selects main content div
var contentDiv = document.getElementById('content');
//Selects the first H2 child element from the content div 
var childH2 = contentDiv.getElementsByTagName("h2")[0];
//Access the style property and set it to 'hidden'
childH2.style.visibility = 'hidden';‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Edit: Garbage 'poop' variable fixed...:smileyblush:

[kevinw]

This worked a little too well Jeff. It blocked all the H2 in the whole course! #lol

Is there a way I can limit it to the syllabus page? 

[themidiman]

You would probably have to do a bit of logic to detect if the URL had the '/syllabus' string. Try this:

//Test for /syllabus in the URL:
if (window.location.href.includes('/syllabus')) {
     //Selects main content div
     var contentDiv = document.getElementById('content');
     //Selects the first H2 child element from the content div 
     var childH2 = contentDiv.getElementsByTagName("h2")[0];
     //Access the style property and set it to 'hidden'
     childH2.style.visibility = 'hidden';
}‍‍‍‍‍‍‍‍‍