william ganrot william ganrot - 20 days ago 4x
HTML Question

On deep water. add a div with js in a php printed line

Maybe I'm way off, but here we go.

print '<li '.$class.'><a id="flodet" href="index.php?artikelid='.$rad["id"].'">'.$rad["header"].'</a> </li>';

This line print links to articles from a database. The class "flodet" just style the link. What I want to do is to create another div inside the class "flodet". I have tried to do this with these couple of lines of javascript.

function myFunc(){
var bild = document.createElement("div");


Am I way off or am I on the right track?


Here is a snippet to play around with.

Few suggestions:

  • '<li '.$class.'> - this seems to be wrong ; use the attribute class
  • You could select the li using ul > li if needed and can avoid setting class to each li; You could even decorate the parent ul with a class and select the li's using ul.myList li where myList is the class of ul

function myFunc() {
  /* To add a 'div' inside the list item anchor */
  var bild = document.createElement("div");
  bild.innerHTML = "My new DIV";
  /* To add a 'div' inside each list item */
  var listItems = document.querySelectorAll("ul > li");
  for (var i = 0; i < listItems.length; i++) {
    var bild = document.createElement("div");
    bild.innerHTML = "My Div" + i;
    /* Add an attribute, say 'class' */
    bild.setAttribute("class", "divClass");

window.onload = myFunc;
/*  To select the list items */

ul > li {
  color: #DDD;

.divClass {
  border: 1px solid #F2F2F2;
    <a id="flodet" href="">Link 1</a> 
    <a id="flodet2" href="">Link 2</a> 
    <a id="flodet3" href="">Link 3</a>