javascript - how to get all span data attribute inside p element

Question

I want to get all the span data attribute inside the p element so that I can compare the values/text of my hidden p element

<div>   
    <ol class="edit-list">
       <li class="edit">
         <p  class="hidden answer" data-answer="He loves fish tacos">He loves fish tacos</p>
         <p>
            <span data-original="Brad">He</span>
            <span data-original="loves">loves</span>
            <span data-original="fish">fish</span>
            <span data-original="tactos">tactos</span>                       
         </p>               
       </li>

       <li class="edit">
         <p  class="hidden answer" data-answer="I love learning!">I love learning!</p>
         <p>
           <span data-original="I">I</span>
           <span data-original="love">love</span>
           <span data-original="learning!">learning!</span>
         </p>
       </li>
       <li class="edit">
          <p  class="hidden answer" data-answer="I ate dinner">I ate dinner</p>
          <p>
             <span data-original="I">I</span>
             <span data-original="ate">ate</span>
             <span data-original="dinner">dinner</span>
           </p>
         </li>
      </ol>
      <button id="validate" >Validate</button>
 </div>

Here is my JavaScript code.

<script type="text/javascript">
  $(function(){
        var mismatch = false;
        $('ol.edit-list li').each(function(){
            var p_answer =  $(this).find('p').attr('data-answer');
            
            var c_annswer =  $(this).find('p').has('span').children().attr('data-original'); // I canno get all the span inside the p;
            
              if(p_answer !== c_answer){
                 mismatch = true;
                 break;
              }
          }         
   });
</script>

question from:https://stackoverflow.com/questions/65904035/how-to-get-all-span-data-attribute-inside-p-element

Answer 1

Waitting for answers