Home/ Questions/Q 7042655
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-28T02:11:41+00:00

This is my first day coding and using jquery, I figured the best way

  • 0

This is my first day coding and using jquery, I figured the best way to learn is practise.
I want to remove content from #container and add new content from an external page.
Should be quite straight forward right?
I have this so far, but it doesn’t work every time. Any assistance would be great.

js

$(document).ready(function(){

  $('.nav a').click(function(){

      var url = $(this).attr('href')+' #content';

      window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-5);

      $('#container').load(url);

      return false;       

  });
});

index.html

<html>

<body>

<div id="container">


    <div id="content">
        <div class="nav">
            <a href="index.html" id="home">Home</a>
            <a href="about.html" id="about">About</a>
            index
        </div>
    </div>
</div>

and about.html

<body>

<div id="container">


    <div id="content">
        <div class="nav">
            <a href="index.html" id="home">Home</a>
            <a href="about.html" id="about">About</a>
            about
        </div>
    </div>
</div>

at the moment it only works every other click.

Thanks for looking

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You’re replacing your original HTML elements with new ones that you load. But at the same time the click event handlers get removed along with the elements and no longer work.

    In older versions of jQuery you could overcome this using live() instead of click(), but with the latest versions – I’m not up to date. I’m sure someone here will add their $0.02 to help.

    Edit: Turns out you can use on()

    $(document).on("click", ".nav a", function() {
    //code goes here
});
    • 0