Python selenium add li to ul

Question

I have this html code

<ul class="select-items">
     <li class="select-items-item" data-label="<first>">Number 1</li>
</ul>

and I want to add a new li like <li class="select-items-item" data-label="<second>">Number 2</li>

What i tried so far : I click the list using the xpath ( that works fine because I can see the list open), addAttribute to the element (that is the tricky part, not working), add javascript code ( not working either)

liItem = """
     var ul = document.getElementByXpath('//*[@class="select-items"]');
     var li = document.createElement("li");
     li.appendChild(document.createTextNode("Element 4"));
     ul.appendChild(li);
 """
 driver.execute_script(liItem);

Any suggestions?

Suggestions about what? What is your question? Where is your code? — JaSON, Dec 17 '20 at 13:42
Edited with some code. As there are some people replying, I believe that the question is clear. — mnmbs, Dec 17 '20 at 13:59
@mnmbs Please don't append the works/snippets from the well researched answers within your original questions. — undetected Selenium, Dec 17 '20 at 14:07
Excuse me? That was not your answer. That was a snippet I wrote and did not work. I had this guy @JaSON that asked for code, so I delivered. Your snippet looks similar but you use different functions to create the li. Please see again the snippets — mnmbs, Dec 17 '20 at 14:11

undetected Selenium · Accepted Answer · 2020-12-17T14:33:32.177

1

To add the following <li> i.e.

<li class="select-items-item" data-label="<second>">Number 2</li>

You can use the following line of code:

scriptTxt = """
    var ul = document.getElementsByClassName('select-items').item(0);
    var li = document.createElement('li');
    li.setAttribute('textContent', 'Number 2');
    ul.appendChild(li);body.appendChild(li);
"""
driver.execute_script(scriptTxt)

References

You can find a couple of relevant detailed discussions in:

Unable to find_element_by_id when element is created via execute_script

edited Dec 17 '20 at 14:33

answered Dec 17 '20 at 13:46

undetected Selenium

183,867
41
278
352

Thank you for your answer. Shouldn't it be ```div.setAttribute``` instead of ```li.setAttribute```? – mnmbs Dec 17 '20 at 13:55
@mnmbs You are adding a `
` with _textContent_ as **Number 2** but not a `
` really.

undetected Selenium

Dec 17 '20 at 13:57

I see. So with ```li.setAttribute('textContent', 'Number 2');``` I set the textContent of the li created at the line before that. – mnmbs Dec 17 '20 at 14:00

Unfortunately, I get this error Message: javascript error: li is not defined – mnmbs Dec 17 '20 at 14:00

@mnmbs, there was a simple mistake in `scriptTxt`. I edited the answer. Instead of `var div = ...` with `var li = ...` – KunLun Dec 17 '20 at 14:07

Thats what I meant with my first comment (which now I see that wrote in the reverse order). Anyway. It now compiles but adds nothing to the list. I am investigating a little bit. – mnmbs Dec 17 '20 at 14:12

There was a mistake at the class name in my program. Now everything is ok. Thank you – mnmbs Dec 17 '20 at 14:17

Also for the snippet to be 100% accurate you need to add this ``` li.appendChild(document.createTextNode("Number 2"));``` otherwise there is no text for the li. Last but not least see the comment I added under my original post because you misunderstood my example. – mnmbs Dec 17 '20 at 14:25

@mnmbs Apologies, I must have overlooked the fineprints of the code. Reverted back your question. – undetected Selenium Dec 17 '20 at 14:27

@mnmbs Can you try the updated answer anw and let me know if that works seamless? – undetected Selenium Dec 17 '20 at 14:34

You need to remove ```body.appendChild(li);``` because it is not found. Also if you don't add ```li.appendChild(document.createTextNode("Number 2"));``` the li has no text and is not showing. – mnmbs Dec 17 '20 at 15:05

@mnmbs `body.appendChild(li);` was edited long ago :) – undetected Selenium Dec 17 '20 at 15:20

hi what is the accurate script, I am facing the issue. – sakulachi8 Jan 03 '21 at 05:56

Python selenium add li to ul

1 Answers1

References

Linked

Related