Customizing Salesforce Approval History Related List

All though Salesforce Approval History related list is very helpful in displaying records Approval changes in a Visualforce  it has one tiny flow which can make your life difficult as a developer.That is the standard Submit and Recall buttons that always display irrespective of approval status of the record.

 <apex:pageblockSection title="Approval Histroy" columns="1">
      <apex:relatedList list="ProcessSteps" ></apex:relatedList>
 </apex:pageblockSection>

   Approval History with submit button

   But this can be fixed by using a simple Jquery function to catch and hide  the submit button using its style class as shown below.

 Add below line to top of the page to import the Jquery library.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script> 

Add below script to the page

<script>

 $(document).ready(function() {  
      
      $("input[name='piSubmit']").hide();
     

   }); 


 </script>

Approval History without submit button

 this function may break if style class of the button is changed by salesforce.