Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to insert External html code to Div with jquery

Here is my Html code,index.html

<body>
    <div id="container">
        <div id="header">

            <div class="menu_div">
                <ul id="menu-bar">
                    <div id="menu_div">
                        <li><a href="#" id="#home">Home</a></li>
                        <li><a href="#" id="#men">Men</a></li>
                        <li><a href="#" id="#women">Women</a></li>
                        <li><a href="#" id="#cosmetics">Cosmetics</a></li>
                        <li><a href="#" id="#accessories">Accessories</a></li>
                        <li><a href="#" id="#services">Services</a></li>
                        <li><a href="#" id="#aboutus">About Us</a></li>
                    </div>
                </ul>
            </div>

        </div>
        <div id="control">
            <p style="position:relative;">Lorem Ipsum...</p>
        </div>
    </div>  

</body>

Here is my Jquery code,to change external div

  <script type="text/javascript">
        $(document).ready(function(){
            $('#aboutus').click(function () {           
                $('#control').load('AboutUs.html #controlAboutUs') ;
            }); 
        });
    </script>

and Here is my External Html.AboutUs.html

<html>
<head>
    <title>About us</title>
    <link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
    <div id="controlAboutUs">
        <div>
            <h3>Welcome From Ivory's Collection</h3>
            <p>
                We export Clothes,Accessories and Branded cosmetics from Japan Directly. We are fully guranteed for quality and designs.We export Clothes,Accessories and Branded cosmetics from Japan Directly. We are fully guranteed for quality and designs.We export Clothes,Accessories and Branded cosmetics from Japan Directly. We are fully guranteed for quality and designs.We export Clothes,Accessories and Branded cosmetics from Japan Directly. We are fully guranteed for quality and designs.We export Clothes,Accessories and Branded cosmetics from Japan Directly. We are fully guranteed for quality and designs.We export Clothes,Accessories and Branded cosmetics from Japan Directly. We are fully guranteed for quality and designs.
            </p>
        </div>
    </div>
</body>
</html>

I tried with simple code for that, it worked. But in this files, it is not working. I don't know why... pls help me

like image 354
Lady Ivory Avatar asked Jan 17 '26 22:01

Lady Ivory


1 Answers

Oh buddy, don't use hash when declaring an id on your html code.

e.g.

 <li><a href="#" id="aboutus">About Us</a></li>

That should do it.

like image 197
Diomedes Andreou Avatar answered Jan 20 '26 11:01

Diomedes Andreou