javascript - Append and Load from an array -

javascript - Append and Load from an array -

i'm pretty new javascript , jquery in general , i've been working on script 3 days now. searched around solution wasn't able find yet. guess search skills suck.

so, i'm trying load element multiple pages , append them existing div. example, have page called test.php has <div id="container"> in it. have multiple other pages called:

pizzas.php pies.php apples.php oranges.php mangos.php etc

these pages i'll pulling info load test.php. each of listed pages has <div id="about"> somewhere in it.

users send me string of pages they'd load through text field fill out. take , split it. using array, i'd create div's each string in array. i'm @ far, assuming user has requested info pizzas, pies, , apples:

<script> var str = "pizzas,pies,apples"; var test = str.split(","); $.each(test, function(i,v){ $('#container').append('<div id="' + v + '"></div>'); }); </script>

which yields:

<div id="container"> <div id="pizzas"></div> <div id="pies"></div> <div id="apples"></div> </div>

after creating new div's, want load #about each page corresponding div. thought adding each loop, doesn't work:

$( '"#' + v + '"' ).load( "index.php?x=" + v + " #about" ); //like $("#pizzas").load('index.php?x=pizzas #about');

and that's stuck. anyway, i'd appreciate help on this.

it looks can utilize after you've created divs:

$("#container > div").each(function() { $(this).load("index.php?x=" + this.id + " #about"); });

or, in in 1 shot this:

var str = "pizzas,pies,apples"; var test = str.split(","); var container = $('#container'); $.each(test, function(i,v){ $("<div></div>", {id: v}).appendto(container) .load("index.php?x=" + v + " #about"); });

javascript jquery arrays jquery-load jquery-append