Span Class String Replace On Click?

Span Class String Replace On Click?

I'm hoping someone might be able to shed some light on how I can replace a span class identifier using JQuery.

The current code which does not work is as follows:
  1. $('#my-navicons a span class').text(function(index,text){
  2. if (this.nextSibling.nodeValue = my-menu-openicon' {
  3. this.nextSibling.nodeValue = this.nextSibling.nodeValue.replace('my-menu-openicon', 'my-menu-closeicon');
  4. }
  5. else {
  6. this.nextSibling.nodeValue = this.nextSibling.nodeValue.replace('my-menu-closeicon', 'my-menu-openicon');
  7. }
  8. });

The respective html code is:

  1. <div id="my-navicons" class="show-for-small-only my-navframe scale-065"><a class="left-off-canvas-toggle menu-icon" href="#"><span class="my-menu-openicon"></span></a></div>

The framework currently being used is Foundation 5.5.2, if that is needed.

Any thoughts would be greatly appreciated.