How to click on a link that loads a html page that in turn loads an external html file via ajax?

Hi i want to click on the icons under the navigation that go to the portfolio.html page and then without clicking on the sidebar load via ajax an external html file. How do i do that?

http://www.tsakalos-advertising.gr/

that is my website

portfolio page i have this code

<script type="text/javascript">
    $(document).ready(function () {
         if (window.location.search == "?istoselides") {
    $('#loading_content').load('what-we-do.html/istoselides').fadeIn(1000);
}

if (window.location.search == "?video") {
    $('#loading_content').load('what-we-do.html/video').fadeIn(1000);
}
    });
</script>

<ul id="icon">
<li id="adv"><a href="what_we_do.html">adv</a></li>
<li id="flyers"><a href="what_we_do.html">flyers</a></li>
<li id="websites"><a href="what_we_do.html?istoselides">websites</a></li>
<li id="video"><a href="what_we_do.html?video">video</a></li>
</ul>

UPDAT开发者_JAVA百科E For some reason i cant comment :( Thanks for your response but i have no idea how to do that. Cant it be done with jquery? Im not experienced at all. Thanks :D

Create a dynamic iframe element and set its src to the external HTML.

Something like:

$('#container').append('<iframe id="dynamic_iframe" />'); 
$('#dynamic_iframe').attr('src', 'http://example.com/page'); 

Where #container is where you want the iframe to be.