Divs & Spans
While the goal of HTML is to choose the appropriate element based on the meaning it holds, it is occasionally necessary to use elements that have no meaning. For this, we have the <div> and <span> elements.
Div versus Span
The only difference between the two elements is that <div> behaves as a block element by default (it stacks and stretches all the way across the container), whilst <span> behaves as inline by default (it behaves like a word in a sentence, lining up horizontally from left-to-right and wrapping to a new line when needed).
It is suitable to make use of these elements whenever style considerations or other functionality requires the use of a container of some kind, but no other HTML element is appropriate to represent the meaning of the content contained.
Div and span elements are simply containers that apply no meaning whatsoever to the content.
For example, for purely stylistic reasons, you may want to use a <span> to add color to a specific word in a logotype: