Question

i have this html ul code

<ul>
  <li> <a href='#' class='approch' alt='1' > 111111 </a> </li>
  <li> <a href='#' class='approch' alt='2' > 222222 </a> </li>
  <li> <a href='#' class='approch' alt='3' > 333333 </a> </li>
  <li> <a href='#' class='approch' alt='4' > 444444 </a> </li>
  <li> <a href='#' class='approch' alt='5' > 555555 </a> </li>
  <li> <a href='#' class='approch' alt='6' > 666666 </a> </li>
  <li> <a href='#' class='approch' alt='7' > 777777 </a> </li>
</ul>

Now I want to make this

when user click on any hyper link i make alt for it contain id number

J Query should take this id and send get request to File and load html code

The Problem Is How to add the answer code from file after the li he click on it

mean if i clicked the first link

<ul>
  <li> <a href='#' class='approch' alt='1' > 111111 </a> </li>
  **My Loaded code should apper here**
  <li> <a href='#' class='approch' alt='2' > 222222 </a> </li>
  <li> <a href='#' class='approch' alt='3' > 333333 </a> </li>
  <li> <a href='#' class='approch' alt='4' > 444444 </a> </li>
  <li> <a href='#' class='approch' alt='5' > 555555 </a> </li>
  <li> <a href='#' class='approch' alt='6' > 666666 </a> </li>
  <li> <a href='#' class='approch' alt='7' > 777777 </a> </li>
</ul>

Answer 1

something like:

$("a").load(url, function(data) {
    $(this).parent().after(data);
});

if you are using the a-elements href as url source you can do it like: http://jsbin.com/uvipaj/edit