title: TradingView widget replacing entire HTML body
body: <p>Trying to add <a href="https://www.tradingview.com/widget/" rel="noreferrer">TradingView widget</a> into my website.
  This widget must load when user <code>select</code> an option from a dropdown. </p>
  
  <p><strong>Issue</strong>: The widget loads, but it replaces everything in the body and thereby the dropdown disappear.</p>
  
  <p><strong>Example</strong>: </p>
  
  <p>HTML Code:</p>
  
  <pre><code>&lt;select name="fx" class="fx"&gt;
      &lt;option value="EURUSD"&gt;EURUSD&lt;/option&gt;
      &lt;option value="EURJPY"&gt;EURJPY&lt;/option&gt;
  &lt;/select&gt;
  </code></pre>
  
  <p>JS:</p>
  
  <pre><code>function changeFX(fx){
    var fxWidget = new TradingView.widget({
        "width": 500,
        "height": 400,
        "symbol": "FX:"+fx,
        "interval": "1",
        "timezone": "Etc/UTC",
        "theme": "White",
        "style": "2",
        "locale": "en",
        "toolbar_bg": "#f1f3f6",
        "hide_top_toolbar": true,
        "save_image": false,
        "hideideas": true
      }); 
    return themeWidget;
  }
  
  $(document).on('change','.fx',function(){
     var widget = changeFX(this.value);
     // do something with widget.
  
  });
  </code></pre>
  
  <p><a href="http://jsfiddle.net/livewirerules/3e9jaLku/5" rel="noreferrer">http://jsfiddle.net/livewirerules/3e9jaLku/5</a>
  (select dropdown option, and see widget loads but dropdown disappears)</p>
  
  <p>Any advice how to make the dropdown doesn't disappear and still TradingView widget load?</p>