Tradeoff of CSS segments and JS functions placement order in source code

Tradeoff of CSS segments and JS functions placement order in source code

This is not a technical but long lasting problem for me. For CSS codes, I
used to put styles for DOM elements (class and id) in the order which is
corresponding to their appearance sequence in the HTML codes.
The problem is that when the codes are getting longer and longer, it
wastes (non-trivial) time for me to locate correct position to insert or
modify a style.
The similar case happens to the JS codes also, in which I place functions
in calling sequence.
The result is that I sometimes want to quickly write my thoughts down, and
just append a style/function in the end of the css/js codes, and the
sequence/ordering is interrupted which further increase the time that I
search for code snippet.
I use Sublime Text mostly. And search function only helps if I know the
keywords in css class or function name.
Is there any design or habit or tool to increase the efficiency for
locating code segment in long source file?