How To: Use JavaScript to hide SP2010 elements (quick & dirty)

Add a

<script src=”http://server/sites/teamsite/Style Library/Scripts/scriptFileName.js” type=”text/javascript”></script>

line in the Master Page that is being used by the page that displays the element that you want to hide. You will need to add that line just above the one that says:

<asp:ContentPlaceHolder id=”PlaceHolderAdditionalPageHead” runat=”server”/>

Then, create a scriptFileName.js file and paste in the following code:

function functionName(){
var varName = document.getElementById(“elementID”);
{ = “none”;
ExecuteOrDelayUntilScriptLoaded(functionName, “sp.js”);
where, in my case, the elementID was this:


You can find this ID by looking at the source code of the page displayed on your browser. Or, click F12 on Internet Explorer, click on the Select icon (little arrow) and then click on the element whose ID you’re after.
The last line in the script

ExecuteOrDelayUntilScriptLoaded(functionName, “sp.js”);

makes sure that the script you just wrote will execute AFTER the page has loaded. If you do not include that line, the script will never find the element with the specified Id as it will be looking for it on a blank page.

MGR: the Intelogist

About MGR: the Intelogist

SharePoint Server developer, turned Sitefinity developer, turned Angular developer, turned SharePoint Online consultant, turned Unily consultant, turned O365 consultant... Never a dull moment!

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes:

<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong> 

This site uses Akismet to reduce spam. Learn how your comment data is processed.