Hide SharePoint Ribbons Using jQuery

Using the jQuery library, the following code may be used to hide SharePoint ribbons from appearing at the top of a SharePoint page. In this example, I am using it to hide the ribbon associated with Quest web parts which are used for generating various charts and graphs. I was not able to find or did not have access to a configurable setting to hide the ribbon, so I had to resort to hiding it programmatically in order to reduce clutter on the screen.

Add a Content Editor Web Part to the page and include the following script in the source (or as a reference to a script file). The setTimeout timer should be modified to meet your individual needs. In this particular instance, there is a slight delay after the page is loaded before the ribbon appears so I set the delay to 100 milliseconds to ensure that hide() was called after the ribbon was displayed.

<script src="https://code.jquery.com/jquery-latest.min.js"></script>

<script language='javascript'>
  $(document).ready(function() {
    setTimeout(function() {
      $('#Ribbon\\.QuestContextualTabGroup').hide();
    }, 100);
  });
</script>

The hardest part is trying to identify the appropriate ID of the element that needs to be hidden especially if the ribbon is generated dynamically as part of a script. I was able to find the ID using the inspect element capability in Firefox, but you may also use the following script to cycle through each of the ribbon tabs to find the one you want to hide.

<script src="https://code.jquery.com/jquery-latest.min.js"></script>

<script language='javascript'>
  $(document).ready(function() {
    setTimeout(function() {
      $("a.ms-cui-tt-a").each(function() {
        var strTabID = $(this).parent().attr("id");
        alert(strTabID);
      });
    }, 5000);
  });
</script>