JSFiddle - React, Tailwind, and code Playground

by Hifni Nazeer

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
<div class="card">
  <div class="card-header">
    <ul class="nav nav-tabs card-header-tabs">
      <li class="nav-item">
        <a class="nav-link active" href="#foo" data-toggle="tab">Foo</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#bar" data-toggle="tab">Bar</a>
      </li>
    </ul>
  </div>
  <div class="card-body">
    <div class="tab-content">
      <div class="tab-pane active show" id="foo">
        <iframe id="e1" src="https://www.cse.lk/" frameborder="0" allowFullScreen="true">
        </iframe>
      </div>
      <div class="tab-pane" id="bar">
      <iframe width="100%" height="540" src="https://www.google.lk/" frameborder="0" allowFullScreen="true">
        </iframe>
      </div>
    </div>
  </div>
</div>

JavaScript

$(document).ready(function() {
	var s = $('iframe#e1').attr('src');
  alert(s);
    $('iframe#e1').attr('src', 'https://google.com');
})