Compare two separate files for similar elements?
Hi friends,
I have two files. oldCourses.html and newCourses.html.
oldCourses.html has elements
<div id="courses-details">
<div>
<div colspan="4"><b>2017 School Courses</b></div>
</div>
<div>
<span>1.</span>
<span>History</span>
<span data-content-type="history" data-key="1" teacher-value="John"> John</span>
</div>
<div>
<span>2.</span>
<span>Sciences</span>
<span i data-content-type="sciences" data-key="2" teacher-value="James"> John</span>
</div>
</div>
newCourses.html has elements
<div id="courses-details">
<div>
<div colspan="4"><b>2017 School Courses</b></div>
</div>
<div>
<span>1.</span>
<span>History</span>
<span i data-content-type="history" data-key="1" teacher-value="John"> John</span>
</div>
<div>
<span>2.</span>
<span>Sciences</span>
<span data-content-type="sciences" data-key="2" teacher-value="Jimmy"> John</span>
</div>
</div>
What I basically want to achieve is compare both the files by data-key and data-content-type and check to see if the teacher-value has changed in the newCourses.html and then add a class .valueHasChanged to the changed span in the oldCourses.html.
In the above example sciences teacher-value has changed from James to Jimmy. In that case oldCourses.html span containing : data-content-type="sciences" data-key="2" should have the class .valueHasChanged.
Thank you in advance..