Expand/Collapse SharePoint all Webparts on a Page

Expand/Collapse SharePoint all Webparts on a Page

Hello.  This jQuery adds expand/collapse functionality to a single SharePoint Webpart by adding a + or - sign next to the webpart title.  It works great with SharePoint Online for a specified webpart (ie WebPartWPQ4).  How can I modify this to add the + and - to all the webparts on a page?

/* Expand-Collapse*/
  jQuery(document).ready(function() {
  jQuery("#WebPartWPQ4").hide();

//Add Expand Icon to Web Part Header

    $('Span#WebPartTitleWPQ4').find('h2').append("<span style='padding-left:0.5em; text-decoration:none'> <img id='ExpandCollapse' src='/_layouts/images/Expand.gif'></span>");

  //toggle the component with class msg_body

  jQuery(".ms-webpart-chrome-title ").click(function()
  {
    jQuery(this).next("#WebPartWPQ4").slideToggle(400);

   //Replace Expand-Collapse Image  

   var ExpandCollIMG = $('img#ExpandCollapse').attr('src');
   if (ExpandCollIMG === '/_layouts/images/COLLAPSE.gif' )
    {
        $('img#ExpandCollapse').attr('src', '/_layouts/images/Expand.gif');
    }
   if ( ExpandCollIMG === '/_layouts/images/Expand.gif' )
    {
        $('img#ExpandCollapse').attr('src', '/_layouts/images/COLLAPSE.gif');
    }
  });
});