Wrinklestudio

Hi Pooja,
A standard method of becoming better and better in anything is to practice continuously. In the field of logic and creativity, there's no end, and you can keep going and set new records with your findings and next goal for yourself.
Now, in case of programming, to become more comfortable with any language is to go beyond writing small programs and think bigger. Now what's more prominent, well let's say an application which in some way useful to the users/customers. Few ideas could be:
- Songs website
- Real estate website
- Social media website
- Kids toys website and anything you can think of.
Now if you think that these kinds of websites already exist, the answer is Yes. But there's always something left in any solution, and that's where innovation starts. You can analyse other sites of your choice, find what you would have done if given a chance to improve that site and work on your idea.
To tighten your grid, do the following:
- Use JS frameworks such as Angular, Node.js etc. to diversify your JS knowledge.
- Use free (or paid) APIs to broaden your reach with more content.
- Understand how to clean up your code to make it more useful and fast.
- Understand and work on local storage to set and get the user's saved data.
There're many more points which you can go for and the above mentioned are to start with. The more you dig, the more chances of finding gems you get.
This answer can be as long as it gets, but I'd instead stop here. Assuming that you got the idea, I wish you all the best in your new journey to take your skills to the next level.

Three months for a newbie with "0" knowledge of JS. Here we go:
(Note: Since your question says on JS, I'm considering you are good with HTML and CSS. Keeping responsive design away from this answer.)
Month 1:
Week 1:
1. Understand what JS is used for. What I'll miss if skipped using JS on my website or application.
2. Why do they call it client-side language?
3. Why is logic so necessary in JS (or any other programming language for that matter)?
4. Say "Hello World" using nothing more than an alert box (don't bother thinking beyond yet).
5. Understand what a "Variable" is, why can't I write my values what they are supposed to be.
6. Understand what data-types are and why they are so important (boolean, null, undefined, String etc.).
7. How to use inline JS, JS tag and <script> tag to include our JS with HTML page.

Week 2:
1. Understand conditional statements (if-else, switch-case)
2. Apply conditional statements in "Hello {variable-value}"
3. Understand for loop
4. Apply for loop in "Hello {loop-increment-variable}"
5. Understand for-each
6. Apply for-each loop in "Hello {value-variable}"
7. Understand functions to "return" some value
8. Apply return in "Hello {function-returned-value}"

Week 3:
1. How to call a function from HTML
2. Understand events, what they are and why they are useful.
3. Understand HTML elements (button, checkbox, radio, combo etc.) and how to get their values using JS and show them in an alert box.
4. Use HTML elements value, apply some conditional statements (e.g. if combo box value is "x" or selected index is "y", show something in alert box).

[Enough for week 3]
Week 4:
1. Create one HTML form (let's say registration form for social media app, like FB).
2. On "Submit" (or call any button which appears at the bottom of the page) button click, call a JS function. Apply some logic and show user's data in an alert box.
3. Get familiar with jQuery [imp].
[Enough for week 4]
[From here on, a breakup is every month]

Month 2:
1. Use the same registration form, get the data and this time go beyond the alert box. Learn how to set HTML elements' values using JS (e.g. span, para etc.). Show the data in another div after the form in the same page (don't bother redirecting to another URL for now).
2. Understand form validations.
3. Understand event bubbling and propagation.
4. Understand cookies and how to use them.
5. Learn what MVC (Model, View, Controller) is, it's value in any project and try to apply it in your registration form with form validation.
6. Learn what an API is. Don't worry, you don't have to write it but use it to get data from the server.
7. Try with some free API (there are many, google will tell you), call it and show it's data in an alert box.
8. Learn what AJAX is, it's usage and how to implement it.
9. Setup your local server (localhost. Google XAMP and rest you'll be told. It's easy!), put some XML / JSON file there and try to load it using AJAX call.
10. Learn how to use AJAX's success and failure events.
11. [SERVER SIDE CODE REQUIRED] If you've successfully set up your localhost (considering XAMP to get PHP work on that), get some necessary code of Php which returns some hard-coded value. Try calling that Php from your JS and show fetched data in the alert box (or in some form, by now you know how to display it in HTML element).
12. [SERVER SIDE CODE REQUIRED] If you can get a decent code which gets values from DB, try your hands with that now. If everything goes well, by the end of this month, you will be done with integrating your client-side application with a server, sending your data in parameters and showing fetched data on UI without refreshing the page, KUDOS!!!

Month 3:
1. Time to break all the barriers. Try creating something on your own. Browse through google search (or any other) API which is free to use. Get Data, render your page, clone elements (div, span, p etc.), put your data in those elements, format it using CSS.
2. Try playing with multiple data holder elements. Browse jQuery plugins, take any complicated control (e.g. data grid). Fetch data from the server, render the grid control dynamically and display your data in there.
3. Try using jQuery pagination control. Again hit some API which returns you loads of data and tries fitting your data with pagination control.
4. Try your hands on your custom control. Start with creating as simple as a checkbox and proceed towards difficulties like combo or table.
Time-Over!!!
The syllabus mentioned above is a high-level idea of how to get JS in 3 months. But I'm sure if you follow this, whatever I left will anyway come across your path. Write back for any further details.
Happy JS.

I'd say it can become messy during basic syntax itself (consider you get to work on someone's code where variable names make no sense, e.g. var t = 70932; no sense in this variable at all").
Let's come back to your question when it becomes messy. Considering that by basic syntax you are pointing to essential client-side interaction code (like calling some function on button click, getting and displaying input value tc.). After basic syntax, let's say your application needs to be connected with server to fetch data, at this moment you would jump the primary coding border and dive into all those ajax calls, validating data and rendering it to your UI for end-user consumption. Here you (or anyone for that matter) can make the code messy by:

1. Not commenting what each method is supposed to do (just like "t" variable example I gave above).

2. Writing function definition inside the loop. I've seen this many devs doing especially during "success" event handler where they run through the retrieved data and writing event handler inside the loop.

3. Adding dynamic nodes to DOM. It is another terrible thing you will see where (again) after getting server data, to display it on UI, developers start adding dynamic nodes to DOM (nothing wrong in it) but most of the time they ignore the fact that where these elements are getting attached. Where in DOM hierarchy they are supposed to be, about their sibling's nodes etc. and this ignorance comes back when your data starts appearing awkwardly on UI and dev start debugging CSS (setting position, z-index, margin etc.)

4. Not respective MVC guidelines. I feel that at times, the code becomes complicated because of situations like project escalations, early release, untimely delivery where the developer is forced to do the work in a hurry. That's where developers start ignoring the fact that not writing correct code at right place might backfire eventually (and most of the time it does happen, speaking by experience). Keep your objects, UI and logic separately. It helps a lot!

5. Naming conventions are ignored (most of the time). As project life increases, team size and faces change. Old people get shifted to other projects, or they leave, and new minds take place. A couple of KT (Knowledge Transfer) sessions are never enough to understand every bit of the code, and the only favour a new coder expects from the old one is to get logical naming conventions, be it a file, variable or function.

6. Last but not least, ignoring the power of "strict mode", these two words alone can do what lines and lines of code can't do; it tells you your sin's beforehand.

There are many more factors which cause messy code and practically not all of them can be thought of, but above are the essential parameters which if prevented can help you live quite easy life at your workplace.

I hope this helps!