javascript - How to link an appended title? -

i have editor allows users enter input , save input under specific title. have button allows them so, adding name of title box (just div white background) using append child.

was wondering how link these titles, such when click on 1 title, text input assigned said title shows inside editor?

javascript:

    <!-- function save user's input inside editor1 -->     function saveedits() {         var editelem = document.getelementbyid("editor1");         var userversion = editelem.innerhtml;         localstorage.useredits = userversion;          //get title user         var title = prompt("what title be?");         localstorage.setitem(title, editelem.innerhtml);          //asigning titles input user key "titles"         titles = localstorage.getitem("titles");          if (titles == null){             titles = [];         }         else {             titles = json.parse(titles);         }          var obj;         obj = {"titles": title};         titles.push(obj);         localstorage.setitem("titles",json.stringify(titles));          //save editor contents local storage based on title         document.getelementbyid("update").innerhtml = "edits saved!";         var thediv = document.getelementbyid("contentable");         var content = document.createtextnode(title);         thediv.appendchild(content);         var br = document.createelement("br");         thediv.appendchild(br);      }      <!-- function check if user has saved input -->     function checkedits() {         if(localstorage.useredits != null)         document.getelementbyid("editor1").innerhtml = localstorage.useredits;     }      function loadedits(title) {         //load useredit title local storage         var useredits = localstorage.getitem(title);         var editelem = document.getelementbyid("editor1");         editelem.innerhtml = useredits;     } 

html (editor):

<!-- editor 1 -->     <div id="editor1" contenteditable="true" style="margin-left:30em">     </div>     <input id="savechanges" type="button" value="save changes" onclick="saveedits()"/>     <div id="update">click save changes made</div> 

you attach onclick-event markup. this.

<div class="container> <h2 class="title" onclick="edit(this)">    editable content below </h2> <div class="editable" onclick="edit(this)"> </div> 

the js

var activeparent; function edit( element ){     var title = element.parentnode.children[ 0 ].innerhtml;     var content = element.parentnode.children[ 1 ].innerhtml;     //do stuff markup     activeparent = element.parentnode;  } 

that how can content , temporarily store active parent reference. when save activeparent.children[ 1 ].innerhtml = editedcontent.

edit: since of these relative references can use many want. careful when using activeparent. assumes edit 1 area @ time.