How to Use Any Other Tag Inside <Ul> Along with <Li>

Can we use any other TAG inside ul along with li ?

For your code to be valid you can't put any tag inside a <ul> other than an <li>.

You can however, put any block level element inside the <li>, like so:

<ul>
        <li>
            <h2>...</h2>
            <p>...</p>
            <p>...</p>
        </li>
</ul>

HTML: Is it valid to put element other than li into ul ?

Directly inside a <ul> or <ol> element, you can only have <li> elements and other <ul> or <ol> elements. All other tags need to be inside of <li>'s.

Is anything except LI's allowed in a UL?

According to the HTML 4 specs, the XHTML 2 specs and the HTML 5 specs that code is invalid.

HTML 4

<!ELEMENT UL - - (LI)+

This means that inside a <ul> there can only be multiple <li> elements.

XHTML

Both types of lists (ul|ol) are made up of sequences of list items defined by the li element.

HTML 5

Content model:

Zero or more li and script-supporting elements.

Note that script-supporting elements are elements that are not rendered, and currently include only <script> and <template>.

correct semantics for ul in ul

You must wrap every inner ULs with an LI, i.e.

<ul class="menu">
    <li>
        <a href="">Uutiset</a>
    </li>
    <li> <----
        <ul class="inside">
            <li><a href="">Fringilla Condimentum</a></li>
            <li><a href="">Lorem</a></li>
        </ul>
    </li> <----
 </ul>

Target ul and li within div using css

first thing is you should remove the . sign from the ul in your css.
we use . signt to define a class and # sign to define an id.
but for default elements or tags provided by html, we don't want to use those. we can use just there name.as an example if we put some style to body we can write like this.

body{
 background-color:black;
}

to get an better idea, I wrote a small code for you.hope this will help

<!DOCTYPE html><html><head> <title></title></head>
<style type="text/css"> body{  margin:0;  padding: 0; }
/* add styles only to for 'ul' element, inside the id="one" div */div#one ul{ list-style-type: none; color: orange;}

/* add style only to the 'li' elements inside the id="one" div. this means 'li' inside the 'ul' inside the 'div' which its id="one" */div#one ul li{ display: inline; margin: 20px;
}
</style>
<body>
 <div id="one">  <ul>   <li>one</li>   <li>two</li>   <li>three</li>   <li>four</li>   <li>five</li>  </ul> </div>
 <div id="two">  <ul>   <li>one</li>   <li>two</li>   <li>three</li>   <li>four</li>   <li>five</li>  </ul> </div>
</body></html>

How to wrap groups of li tags inside ul

The desired output given in your question is invalid as li can't have ul as its content.

I possible alternate is to add the new ul as a descendant of the previous anchor

$('li:not(.sub-item)').each(function() {  var $li = $(this),    $subs = $li.nextUntil(':not(.sub-item)');  if ($subs.length) {    $('<ul />', {      'class': 'sub-menu'    }).html($subs).appendTo($li);  }})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script><ul class='main-menu'>  <li><a href="#">Home</a></li>  <li><a href="#">Pages</a></li>  <li class='sub-item'><a href="#">Contact Us</a></li>  <li class='sub-item'><a href="#">Community</a></li>  <li class='sub-item'><a href="#">About Me</a></li>  <li class='sub-item'><a href="#">Blog</a></li>
  <li><a href="#">DropDown </a></li>  <li class='sub-item'><a href="#">Sub Menu 1</a></li>  <li class='sub-item'><a href="#">Sub Menu 2</a></li>  <li class='sub-item'><a href="#">Sub Menu 3</a></li>  <li class='sub-item'><a href="#">Sub Menu 4</a></li>  <li><a href="#">Sign Out</a></li></ul>

nesting other html tags inside ul except li

According to the spec, the ul element is:

The ul element represents a list of items, where the order of the items is not important — that is, where changing the order would not materially change the meaning of the document.
The items of the list are the li element child nodes of the ul element.

So the children of the UL element must be li elements.

More specifically, it says under the ul tag:

Content model:

   Zero or more li elements.

It is however, perfectly legal to do:

<ul class="site-title left">
   <li><span><h1>site-title</h1></span></li>
</ul>

when I try to get li elements inside a ul I only get one li and nothing else

Its because driver.find_element_by_xpath is returning first element. It may highlight to all the li in the DOM, but you are asking to find a single element and it returns the first one.

Use find_elements to find all the li tags and iterate to get the text from them.

results = driver.find_elements_by_xpath("//ul[@class='firma-info']/li")
for result in results:
     print(result.text)