Changing iframe src with jquery

iframe, javascript, jquery

Solution

The order does matter.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<input type="button" id="changeframe" value="Change">

<iframe id="declinedframe" class="embed-responsive-item" src="http://forgezilla.com" height="585" width="100%" ></iframe>

// Go Last since changeframe hasn't exist yet.
<script>
  $('#changeframe').click(function () {
      $('#declinedframe').attr('src', 'http://stackoverflow.com');
  });
</script>

Problem

I am trying to change my iframe src and reload the iframe with the following code ``` <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script> $('#changeframe').click(function () { $('#declinedframe').attr('src', 'http://stackoverflow.com'); }); </script> <input type="button" id="changeframe" value="Change"> <iframe id="declinedframe" class="embed-responsive-item" src="http://forgezilla.com" height="585" width="100%" ></iframe> ``` When I click "Change" on the button nothing happens. What I am doing wrong?

Original source