How to create a li tag dynamically using selenium webdriver on java

Question

Here is my ol tag

<ol>
<li class="dd-item" ><div class="dd-handle"><img alt="testing" src="test2.png" s><a  name="tree" style="margin:5px;">page1</a></div></li>
<li class="dd-item" ><div class="dd-handle"><img alt="testing" src="test2.png" s><a  name="tree" style="margin:5px;">page2</a></div></li>
</ol>

I want to insert this below tag to above ol tag as 3rd element using selenium webdriver in java

<li class="dd-item" ><div class="dd-handle"><img alt="testing" src="test2.png" s><a  name="tree" style="margin:5px;">page3</a></div></li>

How can i do it?

Answer 1

Webdriver is designed for browser automation, not for changing server side code or HTML returned by the server. However, if you want to change the HTML temporarily on the client side, you'll have to do what everyone else does and run some JavaScript on the browser.

As the Selenium FAQ states, you can execute JavaScript with a WebDriver instance by casting it into a JavascriptExecutor:

WebDriver driver; // Assigned elsewhere
JavascriptExecutor js = (JavascriptExecutor) driver;
js.executeScript("return document.title");

Then you can use JavaScript to manipulate the DOM inside the page being shown on the browser that your WebDriver instance is currently driving.