Home/ Questions/Q 8717567
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-13T06:19:56+00:00

I’m new to SO and a jQuery newbie. I have links being dynamically created

  • 0

I’m new to SO and a jQuery newbie. I have links being dynamically created from a database into 3 different unordered lists. I’m trying to append list items from each of the two lists on the bottom to the the top list inside a new ul tag which will be a sibling to the anchor of each list item in the top list. I need to do this by matching the href attributes. I began playing around with the script below to see if I could exclude the last part of the the urls so it would be easier to match the href attributes. Any help would be greatly appreciated.

<script>$(document).ready(function () {
  var href = $('ul.list li:nth-child(1) a').attr("href");
  var n = href.lastIndexOf('/');
  alert(href.substring(0, n != -1 ? n : s.length));
});
</script>
</head>

<body>
  <ul class="list">
    <li><a href="http://www.mysite.com/index.html">My Site</a></li>
    <li><a href="http://www.google.com">Google</a></li>
    <li><a href="http://www.yahoo.com">Yahoo</a></li>
    <li><a href="http://www.cnn.com">CNN</a></li>
    <li><a href="http://www.espn.com">ESPN</a></li>
    <li><a href="http://www.tsys.com">TSYS</a></li>
  </ul>
  <ul class="combination">
    <li><a href="http://www.mysite.com/index.html">My Site</a></li>
    <li><a href="http://www.google.com">To Index Page</a></li>
  </ul>
  <ul class="combination2">
    <li><a href="http://www.mysite.com/index.html">My Site Too</a></li>
    <li><a href="http://www.yahoo.com">Yahoo Redux</a></li>
  </ul>
</body>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Something like this fiddle

    HTML

    <ul class="list">
    <li><a href="http://www.mysite.com/index.html">My Site</a></li>
    <li><a href="http://www.google.com">Google</a></li>
    <li><a href="http://www.yahoo.com">Yahoo</a></li>
    <li><a href="http://www.cnn.com">CNN</a></li>
    <li><a href="http://www.espn.com">ESPN</a></li>
    <li><a href="http://www.tsys.com">TSYS</a></li>
</ul>
<ul class="combination">
    <li><a href="http://www.mysite.com/index.html">My Site</a></li>
    <li><a href="http://www.google.com">To Index Page</a></li>
</ul>
<ul class="combination">
    <li><a href="http://www.mysite.com/index.html">My Site Too</a></li>
    <li><a href="http://www.yahoo.com">Yahoo Redux</a></li>
</ul>

    Javascript

    $('ul.combination li').each(function() {
    var element = $('.list li a[href="' + $(this).find('a').attr('href') + '"]');

    if (element.siblings('ul').length  == 0) {
        element.after('<ul />');
    }

    element.next('ul').append($(this));
})
    • 0