Accessing nextElementSibling in HTML

[cjreynoldsdfw]

I have written a lightbox script in plain JS:

HTML:

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

JS:

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?

[Dormilich]

@cjreynoldsdfw

This doesn’t work

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…