title: Hide/Show div and change class in span with Jquery function
body: <p>I am using very simple function to hide entire div when clicked and display comments block instead.</p>
  
  <p>Instead of hiding entire div, what I need to do is keep it as it is when clicked, display comment block, but change the class in the span from class="icon expand" to class="icon abate" and hide only "Click here to leave a comment or view what our customers are saying." line so that if it is clicked again it would do the opposite.</p>
  
  <p>here is my script</p>
  
  <pre><code>function myfunc_showComments() {
      if ( typeof jQuery != 'undefined' ) {
          $('#hidecomments').remove();
      }
  var commentsParams ={
  categoryID: 'Widgets',
  streamID: '&lt;?php echo $streamID ?&gt;',
  containerID: 'commentsDiv',
  }
  gigya.services.socialize.showCommentsUI(conf,commentsParams);
  }
  &lt;/script&gt;
  &lt;!-- end #review --&gt;&lt;/div&gt;
  &lt;div id="hidecomments"&gt;
  &lt;div class="button_3" onClick="myfunc_showComments()"&gt;&lt;span class="icon expand"&gt;&lt;/span&gt;&lt;h2&gt;Comment &amp;amp; Rate this &lt;span&gt;&lt;?php echo $widget_title ?&gt;&lt;/span&gt;&lt;/h2&gt;&lt;br /&gt;Click here to leave a comment or view what our customers are saying.
  &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>any suggestions or help is highly appriciated</p>