title: Onclick event in a function not able to call nested function
body: <p>I have a function which has another function in it. There is an onclick event in main function and I want it to call the inner function. However when I click the element, it says that the function is not defined. The onclick event is in a for loop. Here is the code:</p>
  
  <pre><code>function renk(){
          function metinRenginiDegistir(boya){
              //seciliMetinDegistir("&lt;font color='"+boya+"'&gt;"+seciliMetin()+"&lt;/font&gt;");
              alert("a");
          }
          var sagic;
          var renkler=new Array("#000000","#FF0000","#00FF00","#0000FF","#FFFF00","#00FFFF","#FF00FF","#666666");
          var adlar=new Array("Siyah","Kırmızı","Yeşil","Mavi","Sarı","Turkuaz","Magenta","Gri");
          for(i=0;i&lt;renkler.length;i++){
              sagic=sagic+"&lt;tr&gt;&lt;td&gt;&lt;div **onclick='metinRenginiDegistir(this.style.background)'** style='cursor:pointer;width:28px;height:28px;background:"+renkler[i]+";margin-left:17px;'&gt;&lt;/div&gt;&lt;/td&gt;&lt;td&gt;"+adlar[i]+"&lt;/td&gt;&lt;td&gt;"+renkler[i]+"&lt;/td&gt;&lt;/tr&gt;";
          }
          sagic="&lt;center&gt;&lt;table id='renklerinTablosu'&gt;&lt;tr&gt;&lt;th&gt;Önizleme&amp;nbsp;&amp;nbsp;&lt;/th&gt;&lt;th&gt;Renk Adı&amp;nbsp;&amp;nbsp;&lt;/th&gt;&lt;th&gt;Renk Kodu&lt;/th&gt;&lt;/tr&gt;"+sagic+"&lt;/table&gt;&lt;/center&gt;";
          sag.innerHTML=sagic.replace("undefined","");
          //document.getElementById("renklerinTablosu").getElementsByTagName("div").onclick=function(){alert("a");}
          // onclick='metinRenginiDegistir(this.style.background)'
      }
  </code></pre>