Creating a reusable jQuery function

Question

Instead of re-writing a massive block of code each time, I\'m trying to incorporate functions into my work but I\'m having trouble making it work.

Basically, I\'ve got a

Answer 1

Why not just update the src tag of the iframe ...

$('#cTheme1').click(function () { 
    $('input:radio[name=mgChooseTheme]:nth(1)').attr('checked',true); 
            $('#liveDemoFrame').attr('src', <the new url>);
});

Then your iframe would already need to be part of the page :

<iframe id='liveDemoFrame' src='<default page>'></iframe>

i notice your using a CLASS attribute on your iFrame and accessing it using that - you really need to think about using the ID attribute if you are just wanting to refer to a single object. (as in my example above)

Answer 2

Pass in the themeName as an argument of the switchPreview function.

-Change the first line of the function to:

jQuery.fn.switchPreview = function (themeName) {

-For each of the three times you are calling the function, make sure you are passing in the argument, i.e:

$('.liveDemoFrame').switchPreview(themeName);