javascript - Jquery: add iteration index to the name of the class of child/parent <divs> dynamically -

-

i have html page has, 3 div class name "xyz", now, on page load ($(document).ready(function()) each occurring of div "xyz" want introduce inner html/child element "<div class="childxyz###"></div>" ### represents position number of occurrence of parent class xyz . instance, first occurrence of parent class xyz child class name "childxyz1", second occurrence childxyz2 , on.

can suggest simple solution this?

initial page

<div class="xyz">             //appending inner html , pass value 1 xyz first occurrence         </div>   <div class="xyz">     //appending inner html , pass value 2 xyz first occurrence </div>   <div class="xyz">     //appending inner html , pass value 3 xyz first occurrence </div>

the final page when jquery/js script runs should this.

<div class="xyz">     <div class="childxyz1">     </div> </div>   <div class="xyz">     <div class="childxyz2">     </div> </div>   <div class="xyz">     <div class="childxyz3">     </div> </div>   <div class="xyz">     <div class="childxyz1">     </div> </div>   <div class="xyz">     <div class="childxyz2">     </div> </div>   <div class="xyz">     <div class="childxyz3">     </div> </div>

edit have included sample code working on, here wish replace hard-coded value @ 0th , 1th position better code. appreciate in regard.

.datatabletesting0 thead tr th .datatabletesting1 thead tr th

** want achieve 2 dimensional array stores values, such that, @ 0th position store content of first occurrence of class="datatabletesting" , @ 1th position second occurrence of table same class name, on , forth.

$(".datatabletesting").each(function(i) {    $(this).addclass("datatabletesting" + i);  });  var tablearray2 = new array(10);  var tablearray1 = new array(10);  $('.datatabletesting0 thead tr th').each(function(i) {    var celltext = $(this).html();    tablearray1.push(celltext);  });    $('.datatabletesting1 thead tr th').each(function(i) {    var celltext = $(this).html();    tablearray2.push(celltext);  });    $('.test1').each(function(i) {    var celltext = $(this).html(tablearray1);    });    $('.test2').each(function(i) {    var celltext = $(this).html(tablearray2);    });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>  <table class="datatabletesting" cellspacing="0" width="100%">    <thead>      <tr>        <th>first name</th>        <th>position</th>        <th>office</th>      </tr>    </thead>    <tbody>      <tr>        <td>tiger</td>        <td>system architect</td>        <td>edinburgh</td>        </tr>    </tbody>  </table>    <table class="datatabletesting" cellspacing="0" width="100%">    <thead>      <tr>        <th>last name</th>        <th>salary</th>      </tr>    </thead>    <tbody>      <tr>        <td>nixon</td>        <td>$320,800</td>      </tr>    </tbody>  </table>    <table class="test1" cellspacing="0" width="100%"></table>  <table class="test2" cellspacing="0" width="100%"></table>

allnodes = document.getelementsbyclassname("xyz"); for(var i=0;i<allnodes.length;i++){     newnode = document.createelement("div");     newnode.classname = "childxyz" + (i+1);     allnodes[i].appendchild(newnode); }

this?


Comments

Post a Comment

Popular posts from this blog

sequelize.js - Sequelize group by with association includes id -

-
so when requesting group sequelize follows: return models.workingcalendar .findall({ attributes: [ 'workingcalendar.periodid', 'workingcalendar.date', 'period.name' ], include: [ { model: models.period, attributes: [] } ], where: { getsudoid: currentgetsudo.id, unitplantid: unitplantid }, group: ['workingcalendar.periodid', 'workingcalendar.date', 'period.name'], }); sequelize run query: select [workingcalendar].[id], [workingcalendar].[periodid], [workingcalendar].[date], [period].[name] [workingcalendars] [workingcalendar] left outer join [periods] [period] on [wor...
Read more

c++ - Migration from QScriptEngine to QJSEngine -

-
i'm migrating qscriptengine code on qjsengine. now, have: class pars { public: static qscriptvalue printmainlog(qscriptcontext* c, qscriptengine* e); }; qscriptvalue pars::printmainlog(qscriptcontext* c, qscriptengine* e) { //some actions return e->globalobject().property(""); } ... qscriptengine engine; ... engine.globalobject().setproperty("printlog",engine.newfunction(pars::printmainlog)); so, user can put printlog("what ever"); in application in , example, qlineedit , function pars::printmainlog evalute. is there way qjsengine? so, user put same printlog("what ever");? way find here , user should put logger.printlog("what ever"); logger class inherited qobject printlog slot.
Read more

delphi - Take screenshot in webcam using VFrames in Console Application -

-
i'm doing program take picture of webcam using delphi xe2 , vframes achieve this, problem have figured out, in graphic application works fine, when use unit in console application, returns me error saying first chance exception @ $76b6b727. exception class eaccessviolation message 'access violation @ address 004a271b in module 'console.exe'. read of address 00000260'. process console.exe (3676) my unit : unit webcam; interface uses sysutils, windows, vcl.imaging.jpeg, vcl.graphics, vsample, vframes, classes; type twebcam = class private procedure newvideoframeevent(sender: tobject; width, height: integer; dataptr: pointer); public constructor create; destructor destroy; override; procedure capture_webcam(take_name: string); end; var web_image: tvideoimage; name_screen: string; implementation constructor twebcam.create; begin inherited create; end; destructor twebcam.destroy; begin inherited destroy; end; ...
Read more