Как изменить все дочерние элементы дочернего элемента id и div?

Question

• Я хочу получить идентификатор id = "p5pg5QXlX-an-obj-1" в id = "p5pg5QXlX-an-obj-31" внутри класса и применить свойство состояния воспроизведения анимации.

вот мой код:

<div id="p5pg5QXlX-an-anim"><ol> 

<li id="p5pg5QXlX-an-scene-0" > 
<div class="p5pg5QXlX-an-stage"> 
<div id="p5pg5QXlX-an-obj-1"><div><img height="416" width="320"  src="assets/overlay1.png"></div></div> 
<div id="p5pg5QXlX-an-obj-2"><div><img height="416" width="320" src="assets/stars-and-chand.png"></div></div> 
<div id="p5pg5QXlX-an-obj-3"><div><img height="75" width="320" src="assets/stars-support.png"></div></div> 
<div id="p5pg5QXlX-an-obj-4"><div><img height="416" width="320" src="assets/page1-bottom-design.png"></div></div> 
<div id="p5pg5QXlX-an-obj-5"><div><img height="416" width="320" src="assets/page1-minars.png"></div></div> 
<div id="p5pg5QXlX-an-obj-6"><div><img height="416" width="320" src="assets/ramadan.png"></div></div> 
<div id="p5pg5QXlX-an-obj-7"><div><img height="416" width="320" src="assets/mubarak.png"></div></div> 
<div id="p5pg5QXlX-an-obj-8"><div><img height="416" width="320" src="assets/page1hw.png"></div></div> 
<div id="p5pg5QXlX-an-obj-9"><div><img height="416" width="320" src="assets/panel.png"></div></div> 
<div id="p5pg5QXlX-an-obj-10"></div> 
<div id="p5pg5QXlX-an-obj-11"></div> 
<div id="p5pg5QXlX-an-obj-12"><div><img height="89" width="89" src="assets/rplay.png"></div></div> 
</div> 
</li> 

<li id="p5pg5QXlX-an-scene-7" > 
<div class="p5pg5QXlX-an-stage"> 
<div id="p5pg5QXlX-an-obj-13"><div><img height="416" width="320" src="assets/overlay2.png"></div></div> 
<div id="p5pg5QXlX-an-obj-14"><span>Receiver Name</span></div> 
<div id="p5pg5QXlX-an-obj-15"><span>Wishing you a wonderful Birthday and a prosperous year ahead!</span></div> 
<div id="p5pg5QXlX-an-obj-16"><div><img height="119" width="111" src="assets/page2-logo.png"></div></div> 
<div id="p5pg5QXlX-an-obj-17"><div><img height="416" width="320" src="assets/page2hw.png"></div></div> 
<div id="p5pg5QXlX-an-obj-18"><div><img height="416" width="320" src="assets/panel.png"></div></div> 
</div> 
</li> 

<li id="p5pg5QXlX-an-scene-4" > 
<div class="p5pg5QXlX-an-stage"> 
<div id="p5pg5QXlX-an-obj-19"><div><img height="416" width="320" src="assets/overlay3.png"></div></div> 
<div id="p5pg5QXlX-an-obj-20"><div><img height="350" width="639" src="assets/3-3.jpg"></div></div> 
<div id="p5pg5QXlX-an-obj-21"><div><img height="350" width="639" src="assets/3-1.jpg"></div></div> 
<div id="p5pg5QXlX-an-obj-22"><div><img height="350" width="639" src="assets/3-2.jpg"></div></div> 
<div id="p5pg5QXlX-an-obj-23"><div><img height="416" width="320" src="assets/page2hw.png"></div></div> 
<div id="p5pg5QXlX-an-obj-24"><div><img height="416" width="320" src="assets/panel.png"></div></div> 
<div id="p5pg5QXlX-an-obj-25"><div><img height="40" width="320" src="assets/strip.png"></div></div> 
<div id="p5pg5QXlX-an-obj-26"><div><img height="40" width="54" src="assets/map.png"></div></div> 
<div id="p5pg5QXlX-an-obj-27"><div><img height="40" width="54" src="assets/phone.png"></div></div> 
<div id="p5pg5QXlX-an-obj-28"><div><img height="40" width="54" src="assets/url.png"></div></div> 
<div id="p5pg5QXlX-an-obj-29"><div><img height="40" width="54" src="assets/email.png"></div></div> 
<div id="p5pg5QXlX-an-obj-30"><div><img height="39" width="43" src="assets/giftcard.png"></div></div> 
<div id="p5pg5QXlX-an-obj-31"><div><img height="40" width="50" src="assets/social.png"></div></div> 
</div> 
</li> 

</ol> 
</div> 

я хочу, чтобы применить анимацию госсобственность всех идентификаторов из ид = "p5pg5QXlX-ан-OBJ-1" в ид = "p5pg5QXlX-ап- obj-31 ", пожалуйста, скажите мне, как получить доступ к идентификатору внутри класса?

я сделал это:

var id = document.querySelectorAll("#p5pg5QXlX-an-anim > ol> li > div > div"); 
     [].forEach.call(id, function(el, i) { 
      el.style.WebkitAnimationPlayState = "paused"; 
      el.style.animationPlayState = "paused"; 
     }); 

, но он работает только для первого элемента Li с не для всех Lī элемента поэтому, пожалуйста, помогите мне &

, потому что я хочу, общий код это так, пожалуйста, помогите мне в этом & попробуйте дать soln в javascript

Answer 1

Вы можете быть более конкретным с вашим селектором u sing:

tag[attribute^="value"] 

Это приведет к выбору любого тега, начинающегося со значения, указанного вами. В вашем случае я верю, что вы хотели бы попробовать:

li[id^="p5pg5QXlX-an-obj-"] 

Все ваши идентификаторы начинается с этой строкой. Надеюсь, это поможет.