Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.


Keith Doyle
Keith Doyle
25,973 Points

Updating iframe content

Had a project I was working on and we have multiple pieces of content from an eLearning program that is displayed in a single iframe on a page. I had to swap out that content when a user clicked on a button to move to the next module.

Here's my jquery code that accomplishes that. Just wanted to see if it was efficient enough or if I was on the right track. Thanks for any input.

If a user clicks on the button, it swaps in the new iframe content and then updates the title with the text from the link they clicked. I was using <a> before <button> but swapped it out right before posting this.

<button class="button-1" href="assets/accountClose/story.html" name="Intro">Intro</button>
$button = $('button.button-1');

  $newUrl = $(this).attr('href');
  $newTopic = $(this).html();

  $('#ifrm').attr('src', $newUrl);
Richard Duncan
Richard Duncan
5,568 Points

Do you have other elements that have the class button-1? If no then the button prefix in your jQuery selector is redundant. You're also not using $button anywhere else in this example so that whole line could be removed and replaced with

$( '.button-1' ).click(func...
Keith Doyle
Keith Doyle
25,973 Points

Richard Duncan - I actually did that right after I posted this. Thanks for the info!