Accessing nextElementSibling in HTML

I have written a lightbox script in plain JS:


<img onclick="pLightbox(this)" src="MyPhoto.jpg" />


function pLightbox(objPhoto){
   var path=objPhoto.src;
   HTMLtext = '<img src="' + path + '">';
   containerDiv.innerHTML = HTMLtext;

(code abbreviated for clarity)

This works fine. Now I’m trying to access the next sibling within the DIV. I have tried:

HTMLtext += '<img src="images/Next.png" onclick="pLightbox(' + objPhoto.nextElementSibling + ')">';

This doesn’t work - Tried several different variations (nextElementSibling.src, etc.) , but nothing works.

How do I access the next sibling from an HTML string?

obviously. when you call it, the next sibling is not yet appended to the DOM. therefore you cannot access it.

this is also caused by the use of inline JS. if the JS were separate, you could determine the next sibling based on the current element…

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.