Develop Reference

Can I write a chrome extension to change the CSS of a page or site as the page loads?

In GitHub, I cannot stand how the side menu is located on the right side when you are in a repository. It drives me nuts, so I want to script something that will change the float:right property on the side menu to float:left.
A buddy of mine suggested I write a chrome extension for this. Before I look into that, I wanted to get feedback on what options I have to accomplish this.

You could either use Greasemonkey (named Tampermonkey in Chrome) to add user scripts, or if the CSS element has an unique path to identify it, you can use Stylish to overwrite CSS properties.
I recommend the latter. It is easy and will certainly work.

How to remove/reset external css styles with JQ?

I want to reset remove or make initial all the css properties defined in an external css file. I want the solution should also work when I edited/added/removed properties in css file.
So solutions in here don't work.
For example $('div').css('width','');, is not a solution cause it clears the width property in a HARDCODED way.
Also solutions like $('div').attr('style',''); does not work cause I do not use inline styling, also again $('div').removeClass(''); is not a valid solution.
Any answer would be appreciated, thanx.
You can playaround the code here: http://codepen.io/ertugrulmurat/pen/JEhfe
And; How to dynamically remove a stylesheet from the current page is not a solution, another side effect of this is that it removes all styles for all elements, this is not the case wanted

Just use this $('link[rel=stylesheet][href~="external_css_link.css"]').remove(); and remove the link of the css file which you don't want in similar manner you can again add the file
UPDATE
I tested the same in local file system where css is other file and run the same code and found that the style is removed completely and it behave in complete different manner as it working in the online javascript editor jsfiddle or any other because they internally include the css in the page they don't include the an external link thats why
$('link[rel=stylesheet]').remove();
not work here in your sample
in other way it remove the style completely

When working with an already made website, how do you know which file to edit to change something?

Let's say I'm building a website and using an already made Wordpress theme. Say it's a pretty complex theme and there's a lot of folders and files. If I wanted to change something specific, like text, or an image, or something that happens in Javascript/jQuery, and the change that I want is not an option in the themes control panel, what do I do? I know I have to go into the files but how do I know which file to go to? Lately, I've just download the theme to my desktop and use the windows search companion and type in the field that says "a word or phrase in the file." Sometimes it comes up and sometimes it doesn't. For CSS changes I usually use Firebug and click on the element, but many times I want to change the HTML/PHP/Javascript. I feel like I'm doing it the wrong way and there's an easier way that I'm missing.

As you mentioned WordPress theme so I will specifically try to answer this question for editing WordPress theme.
When it comes to WordPress, everything is very structured and well organized. If theme written following standard practices then each component has its specific file. If you are familiar with WordPress theme structure and want to change php code or say a static part then all you need to do is locate the component file say sidebar.php, home.php, single-{type}.php, header.php and many similar files. http://codex.wordpress.org/Template_Hierarchy
Now if you want to edit something that is shown in right/left side of page as sidebar then chances of finding it in sidebar.php are maximum. Similarly to change something on home page try looking for home.php, for posts it could be single-post.php.
Many a times what you are looking to change might need a tweak in widgets. In this case, process remains same as theme you just need to look in different folder.
Javascript: For editing javascript, beautify the code if it came minified. When you have code ready much of js debugging can be done using firebug/Developer Console in chrome. Best way is to put breakpoints at relevant position and then inspect code behavior. You will be able to locate code block that you need to tweak to achieve what you want.
CSS: Create a child theme and then use it override default theme properties.

You can probably use grep in PowerShell, Cygwin, etc.
grep -lir "a word or phrase in the file." *
edit: Emulating Grep in Powershell

TinyMCE link tool - how to add CSS styles to links dynamicaly?

I have searched around but wasn't able to find a solution.
What I want to find out is a way to edit the tinyMce link plugin (or make an edited copy of it) to work in a way that adds specific styling within the link tag, and the ability to specify in the initialization of the plugin what style to add, so that it can be done dynamically. So that I can have result like this(for example):
<a style="color:#00FFFF" href="www.google.com">Google</a>
Any solutions for this? Or a point in the best general direction?
Thanks

In this case i think the best is to wait until the link has been inserted and then do the following action assuming your color has been set in the tinymce init like my_link_color: 'green',
$(ed.getBody()).find('a').attr('style','color:'+ed.getParam("my_link_color"));

Do Auto complete plug-in for jquery comes with out css

Is their any jQuery plug-in for auto complete that allows our own styling?
Every library i see comes with a built in cascading style sheet.

Yes and no.
At http://jqueryui.com/download you can select "no theme", but you will still get an .css that you need to use. That css is used in the javascript code to open, close and interact with the autocomplete menu and text.
It is pretty easy to alter the .css to make it look like you want it to. Try some small changes and reload the page to see what happens!

I don't have a perfect script for you, but you can download the Jquery-ui library with the "No Theme" option.
In fact, there is a minimalist default theme, but you can easily override it in order to build your own theme.

jQuery UI Does indeed allows user-based styling. You can simply change the css file as if you'd do from scratch. Heck, just write down the class names and create your own...