CODEWITHSUNDEEP
javascriptjqueryhtmlcss
Ari4
Ari4

Reputation: 970

How to manipulate imported HTML file using external jQuery file?

I imported a html file using jquery like below,

$(".IncludeInThisDiv").load("ToBeImported.html");

My ToBeImported.html file is like below,

enter image description here

Now I want to change the background color of testDiv which is imported in lets say main.html file. To do so I added a js file called main.js in the project and included it in the main.html file by proper manner. And I have been written the proper jquery code to change the background color of testDiv in main .js file, But that is not working at all.

I think there is some issue with that.

Note: I can manipulate the color from browser console using same jQuery code.

Upvotes: 0

Views: 90

Answers (1)

hsh
hsh

Reputation: 1855

Probably you are changing div's css before it loads completely.

Call load function with complete handler like this:

$(".IncludeInThisDiv").load("ToBeImported.html", function() {
  $(".testDiv").css("background-color","red");
});

Upvotes: 2

Related Questions