Is This HTML Structure Valid? Ul > Div > { Li, Li } , Div > { Li, Li } , Div > { Li, Li }

Is this HTML structure valid? UL DIV { LI, LI } , DIV { LI, LI } , DIV { LI, LI }

No, div is not allowed as a direct child of ul. Whenever you're in doubt, validate your page with W3C or check the corresponding article on W3C:

4.5.6 The ul element
Categories

Flow content.
Contexts in which this element can be used:

Where flow content is expected.
Content model:

Zero or more li elements.
Content attributes:

Global attributes
DOM interface:

interface HTMLUListElement : HTMLElement {};

Instead you could use

<ul class="blog-category">
    <li class="three column">
        <ul>
            <li>Item 1</li>
            <li>Item 2</li>
            <li>Item 3</li>
        </ul>
    </li>
    <li class="three column">
        <ul>
            <li>Item 4</li>
            ...
        </ul>
    </li>
</ul>

is this HTML valid? ul li class= head News roll /li li News 1 /li li News 2 /li /ul

Yes, it is fine.

As for your structure, maybe you want to use the h2 tag outside of the ul? (Assuming it's going to be a header for that list).

<h2>News Roll</h2>
<ul>
    <li>News 1</li>
    <li>News 2</li>
</ul>

Can wrapping a div or an anchor tag around a LI still be considered valid html structure

No, it is not valid, though it often works.

Yes, the reason most people do like this is to make it clickable.

There is many ways to make any element besides an anchor clickable, where wrapping an anchor around it is the most used.

This is valid for all non block level elements, but will likely work on all element level types because of event bubbling.

For block level elements (can also be used on inline elements), one can do like this, to make the whole element clickable

HTML

<div class="clickable"><a href='....'></a></div>

CSS

.clickable a {
  display: inline-block; height: 100%; width: 100%;   /*  fill the parent  */
}

An alternative when one just can't use an anchor and still need it clickable, would be by using a click handler, like this, using jQuery.

$( "li" ).click(function() {
  // Do something here on click
});

Is div inside list allowed?

Yes it is valid according to xhtml1-strict.dtd. The following XHTML passes the validation:

<?xml version="1.0"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Test</title>
</head>
<body>
<ul>
  <li><div>test</div></li>
</ul>
</body>
</html>

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>.

Can I use div as a direct child of UL?

No. The only element that may be a child of <ul> is <li>.

HTML 4:

<!ELEMENT UL - - (LI)+                 -- unordered list -->

(See also how to read a content model definition in a DTD)

HTML 5:

Content model:
Zero or more li elements.

Regular Expression, how to validate html ul li

Using an HTML scraping library such as jsoup is easier and fun than using plain regex. Since jsoup is a java library, you should be able to use it with groovy.

Can you put li elements inside a div

If you search for "HTML Validator" you can quickly run some code through one to see if it is valid or not. Div tags aren't valid as first level child elements of a ul tag. Whatever you are trying to achieve can be accomplished by styling the li tags with CSS.

What type of element is an ` li `?

The confusion probably arises because the terms "block" and "inline" have been applied to various different things.

Collections of elements in the HTML DTDs

li falls into neither group because it is only allowed as a child element of ul and ol rather then the many places that %block and %inline content is allowed.

CSS display properties

As well as elements which have those values for that property by default.

li elements have been display: list-item since CSS 1.

Elements which trigger line breaks (and those which do not)

These are very broad terms that aren't really useful in a technical sense.

HTML 5 has dropped the terms for the purposes of describing elements, and you should too.

What is allowed inside of one of these ambiguous tags?

See the HTML 5 specification:

Content model:

Flow content.

Flow content is defined as:

a

abbr

address

area (if it is a descendant of a map element)

article

aside

audio

b

bdi

bdo

blockquote

br

button

canvas

cite

code

data

datalist

del

details

dfn

dialog

div

dl

em

embed

fieldset

figure

footer

form

h1

h2

h3

h4

h5

h6

header

hr

i

iframe

img

input

ins

kbd

keygen

label

main

map

mark

math

meter

nav

noscript

object

ol

output

p

pre

progress

q

ruby

s

samp

script

section

select

small

span

strong

style (if the scoped attribute is present)

sub

sup

svg

table

textarea

time

u

ul

var

video

wbr

text

Is This HTML Structure Valid? Ul > Div > { Li, Li } , Div > { Li, Li } , Div > { Li, Li }