How to restrict script editor to make changes to only one of two list web parts on a page

Question

I have two list web parts on a page. When I add some css code to the script editor webpart, it makes changes to both lists, but I want to make changes only one list. What do I need to do in order for it to style only my desired list and not both?

Answer 1

The probleme here is that you are modifying built-in css types. That's why those changes are applied to your second webpart too. You could use jQuery to apply new classes to the webpart you want to change and use the styles you defined.

How to get/change Webparts by javascript: https://msdn.microsoft.com/en-us/library/office/hh185010(v=office.14).aspx

Other interesting way would be to use jslink http://www.sharepointnutsandbolts.com/2013/01/using-jslink-to-change-ui-of-sharepoint_20.html

Answer 2

I got an easy way of doing this. For doing this we have to first get the id of the list from the source i.e by clicking going to the view page source and then we have to use the same ID in the script editor.This is how we can restrict script editor to make changes to only one list in the page and not affecting others.