javascript - Removing the content from an svg tag with snapsvg -

i'm using http://snapsvg.io/ when user clicks on chip bet should show svg image chip color, if user clicks chip shoud show new chip. , i'm not being able remove content before appending diferent svg content, what's happening svg gets put on top of previous svg.

i don't want append more content, want replace it. don't seem find other option besides .append() that's why try .removedata() before appending not working. keeps putting next svg image on top of previous one. hope i'm making little sense here.

this how code looks on react.

         componentwillreceiveprops () {            if (this.props.chipselectedsvg) {              const tipchipsnap = snap('#tipchip');              const tipchipsvgcontent = snap.parse(this.props.chipselectedsvg.content);              tipchipsnap.removedata();              tipchipsnap.append(tipchipsvgcontent);             }          }           render () {             return (              <div id="tips-tooltip-container" style={{visibility : tooltip}}>                 <svg id="tipchip" classname="chip" viewbox="-15 -20 120 120"></svg>              </div>          } 

use element.remove() method.

http://snapsvg.io/docs/#element.remove