how to write content the parent which encloses the script tag

Question

I am writing a script inside a tag.

<ul class="boxes_tree">
  <li><strong>data</strong></li>
  <script type="text/javascript">
    var itemStr ='[data1,data2]';
    itemStr=$.parseJSON(itemStr);
    if(itemStr){
          for (var key in itemStr)
          {
             if (itemStr.hasOwnProperty(key))
             {
                itemStr[key];
             }
          }
    }
  </script>
</ul>

now inplace of itemStr[key]; I want to add a li tag with itemStr[key] as content of li tag.

How can I achieve this?

I tried document.write(itemStr[key]); but that will write the content to the document but not inside the parent tag — Seeker, Jan 22 '13 at 12:37
So create the li element, you've heard of document.createElement() right? — Ja͢ck, Jan 22 '13 at 12:38
but that will create the element at the document level right? — Seeker, Jan 22 '13 at 12:39
how do I refer the enclosing ul tag from inside the script tag without using any ID — Seeker, Jan 22 '13 at 12:42
What the data1, data2 is? Also, you enumerating properties of `itemStr` Array instance, not elements in array — Yuriy Rozhovetskiy, Jan 22 '13 at 12:43

score 0 · Answer 1 · edited May 23 '17 at 11:52

0

You can use document.write:

document.write("<li>" + itemStr[key] + "</li>");

As far as I know, that is the only way to achieve what you are trying to do. However, you might want to reconsider your design altogether. because using document.write is considered a poor practice.

edited May 23 '17 at 11:52

Community

1
1

answered Jan 22 '13 at 12:42

jevakallio

33,015
3
95
111

this doesn't help.. because this erase whole of my page contents and writes the li tags – Seeker Jan 22 '13 at 12:44
1

No it does not - as long as you do not call it as a function after load – mplungjan Jan 22 '13 at 12:44

mplungjan · Answer 2 · 2013-01-22T12:51:33.563

0

Works for me with valid JSON

You use jQuery anyway so DEMO

$(function() {
  var itemStr ='[{"var":"data1"},{"var":"data2"}]';
  itemStr=$.parseJSON(itemStr);
  var $ul = $("#tree");
  if(itemStr){
    $(itemStr).each(function(i, val) {
      $ul.append("<li>"+val.var+"</li>");
    });
  }
});

document.write version: DEMO

edited Jan 22 '13 at 12:51

answered Jan 22 '13 at 12:42

mplungjan

134,906
25
152
209

score 0 · Answer 3 · answered Jan 22 '13 at 12:53

0

How about move it to the head and make it this way with jQuery?

$('.boxes_tree').append("<li>" + itemStr[key] + "</li>");

answered Jan 22 '13 at 12:53

gregjer

2,715
2
17
18

how to write content the parent which encloses the script tag

3 Answers3